English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
border-color CSS属性是用于设置单个边框颜色属性,即一个简写速记属性;border-top-color،border-right-color،border-bottom-color和border-left-color为单一的声明。
下表为此属性的用法说明和版本历史记录,以及该属性在javascript脚本中的使用语法。
默认值: | 查看全部属性 |
---|---|
适用于: | 所有元素 |
继承: | 没有 |
可动画制作: | 是。请参考 动画属性。 |
版本: | CSS 1،2،3 |
JavaScript语法: | object object.style.borderColor="#cc0000 red" |
نموذج هذا الخصائص هو:
border-color: [ color | transparent ] 1 to 4 values | inherit
يمكن استخدام هذا المختصر المختصر بجمع قيم متميزة واحدة، إثنتين، ثلاثة أو أربعة.
إذا تم تحديدقيمة واحدة، فإنها تطبق على جميع الهوامش.
إذا تم تحديدقيمتين، فإن القيمة الأولى تُستخدم للهوامش العلوية والسفلية، والقيمة الثانية تُستخدم للهوامش اليمنى واليسرى.
إذا تم تحديدثلاثة قيم، فإن القيمة الأولى تُستخدم للهوامش العلوية، والقيمة الثانية تُستخدم للهوامش اليمنى واليسرى، والقيمة الثالثة تُستخدم للهوامش السفلية
إذا تم تحديدأربعة قيم، فإن كل قيمة ستطبق على الهوامش بناءً على الترتيب: أعلى، يمين، أسفل، وشمال.
المثال أدناه يوضح كيفية استخدام الخاصية border-color.
p { border-style: solid; border-color: #ff0000; }اختبار ل‹/›
ملاحظة:يجب أن تدلي ببيان الخاصيةborder-styleعليك أن تدلي ببيان الخاصية border-color قبل أن يمكنك تعيين لون الهوامش، لأنborder-styleقيمة الخاصية الافتراضية هي none.
جدول أدناه يصف قيم الخاصية.
القيمة | الوصف |
---|---|
color | تحديد لون الهوامش. شاهدقيم الألوان CSSللحصول على قائمة بالألوان المحتملة. |
شفاف | يسمح للهوامش بأن تكون شفافة، رغم أن ذلك قد يأخذborder-widthالمكان المخصص للخصائص. |
initial | قم بتعيين الخاصية إلى قيمتها الافتراضية. |
inherit | إذا تم تحديد، فإن العنصر المرتبط يستخدم قيمة الخاصية border-color للعنصر الأم. |
متوافق مع متصفحات border-color الخاصية، الأرقام في الجدول التالي تمثل أحدث إصدار من المتصفح الذي يدعم الخاصية؛ جميع المتصفحات الرئيسية تدعم الخاصية.
|
شاهد الدروس التالية:CSS Border،CSS3 Border。
الخصائص ذات الصلة:border،border-style،border-width،border-top-color،border-right-color،border-bottom-color،border-left-color。