عرض مصدر CSS/border-top-color

<noinclude>{{DISPLAYTITLE:الخاصية <code>border-top-color</code>}}</noinclude>
الخاصية <code>border-top-color</code> في CSS تُحدِّد لون الإطار العلوي الخاص بالعنصر. لاحظ أنَّه في أغلبية الحالات يُفضَّل استخدام خاصيات CSS المختصرة مثل <code>[[CSS/border-color|border-color]]</code> أو <code>[[CSS/border-top|border-top]]</code>.

== بطاقة الخاصية ==
{| class="wikitable" style="width: 100%;"
|-
! scope="row" style="width: 20%;" |[[CSS/initial value|القيمة الابتدائية]]
|<code>currentcolor</code>
|-
! scope="row" |تُطبَّق على
|جميع العناصر.
|-
! scope="row" |قابلة للوراثة
|لا
|-
!قابلة للتحريك
|نعم
|-
! scope="row" |القيمة المحسوبة
|اللون المحسوب.

|}<syntaxhighlight lang="css">
/* <color> قيم */
border-top-color: red;
border-top-color: #ffbb00;
border-top-color: rgb(255, 0, 0);
border-top-color: hsla(100%, 50%, 25%, 0.75);
border-top-color: currentcolor;
border-top-color: transparent;

/* القيم العامة */
border-top-color: inherit;
border-top-color: initial;
border-top-color: unset;

</syntaxhighlight>
== أمثلة ==
سنضبط في المثال الآتي إطارًا علويًا لعناصر <code>[[HTML/div|<nowiki><div></nowiki>]]</code> لونه (<code>border-top-color</code>) أخضر، وعرضه (<code>[[CSS/border-top-width|border-top-width]]</code>) يساوي <code>4px</code> وشكله (<code>[[CSS/border-top-style|border-top-style]]</code>) منقط. شيفرة HTML:<syntaxhighlight lang="html">
<div>لهذا العنصر إطارٌ على حافته العلوية</div>
</syntaxhighlight>شيفرة CSS:<syntaxhighlight lang="css">
div {
  border-top-style: dotted;
  border-top-width: 4px;
  border-top-color: green;
  padding: 0.5em;
}
</syntaxhighlight>
==دعم المتصفحات==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
! الدعم الأساسي
|1.0
|1.0
|4
|3.5
|1.0
|}

== البنية العامة ==
تقبل الخاصية <code>border-top-color</code> قيمةً واحدةً.

=== <code>[[CSS/color value|<color>]]</code> ===
لون الإطار السفلي.

=== البنية الرسمية ===
<syntaxhighlight lang="css">
border-top-color: <color>;

</syntaxhighlight>
== انظر أيضًا ==
*صفحة الخاصيات التي تضبطها الخاصية المختصرة <code>[[CSS/border-top|border-top]]</code> وهي: <code>[[CSS/border-top-width|border-top-width]]</code>، و <code>[[CSS/border-top-style|border-top-style]]</code>.
*صفحة الخاصيات التي تضبطها الخاصية المختصرة <code>[[CSS/border|border]]</code> وهي: <code>[[CSS/border-width|border-width]]</code>، و <code>[[CSS/border-style|border-style]]</code>، و <code>[[CSS/border-color|border-color]]</code>.
*ضبط صورة للإطار باستخدام الخاصية <code>[[CSS/border-image|border-image]]</code>.
*الأركان المدورة <code>[[CSS/border-radius|border-radius]]</code>، وللأركان العلوية <code>[[CSS/border-top-left-radius|border-top-left-radius]]</code> و <code>[[CSS/border-top-right-radius|border-top-right-radius]]</code>.
*الخاصية <code>[[CSS/color|color]]</code> التي تضبط لون العنصر، والقيمة اللونية <code>[[CSS/color value|<color>]]</code>.

== مصادر ومواصفات ==
* مواصفة [https://drafts.csswg.org/css-backgrounds-3/#border-top-color CSS Backgrounds and Borders Module Level 3].
* مواصفة ‎[http://www.w3.org/TR/CSS2/box.html#border-color-properties CSS Level 2 (Revision 1)‎]. 
[[تصنيف:CSS|{{SUBPAGENAME}}]]
[[تصنيف:CSS Property|{{SUBPAGENAME}}]]
[[تصنيف:CSS Border|{{SUBPAGENAME}}]]