آموزش ویژگی border-bottom-color در CSS
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی border-bottom-color در CSS با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
ویژگی border-bottom-color در CSS
با استفاده از ویژگی border-bottom-color در CSS میتوان رنگ بوردر پایین یک عنصر را مشخص و یا تعریف کرد.
توجه داشته باشید که حتما باید اول استایل بوردر تعریف شده باشد در غیراینصورت رنگ اعمال نخواهد شد.
Free-Learn
مثال از این ویژگی
در ادامه میتوانید یک مثال از ویژگی border-bottom-color را در زبان CSS مشاهده نمایید.
مثال شماره ۱ : استفاده از نام رنگ
|
1 2 3 4 5 6 7 8 |
<style> h2{ border-bottom-style:solid; border-bottom-color:orange; } </style> |
مثال شماره ۲ : استفاده از کد هگزادسیمال یا HEX رنگ
|
1 2 3 4 5 6 7 8 |
<style> h2{ border-bottom-style:solid; border-bottom-color:#5db616; } </style> |
مثال شماره ۳ : استفاده از کد RGB رنگ
|
1 2 3 4 5 6 7 8 |
<style> h2{ border-bottom-style:solid; border-bottom-color:rgb(156,10,13); } </style> |
Free-Learn
جدول مشخصات ویژگی border-bottom-color در CSS
در جدول زیر میتوانید مشخصات کلی این ویژگی را در زبان CSS مشاهده نمایید.
| مقدار پیش فرض | رنگ متن عنصر |
|---|---|
| قابل ارث بری | ندارد | اطلاعات بیشتر |
| قابل متحرک سازی | دارد | اطلاعات بیشتر |
| نسخه | CSS1 |
| نحوه استفاده در جاوااسکریپت | object.style.borderBottomColor=”blue”; |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از ویژگی border-bottom-color در CSS پشتیبانی میکنند یا خیر.
| نام ویژگی | Chrome | Firefox | Opera | Safari | IE |
| border-bottom-color | ۱٫۰ | ۱٫۰ | ۳٫۵ | ۱٫۰ | ۴٫۰ |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در CSS بصورت زیر می باشد.
|
1 |
border-bottom-color: color|transparent|initial|inherit; |
Free-Learn
جدول مقادیر ویژگی border-bottom-color در CSS
در جدول زیر میتوانید، مقادیری را که میتوان در این ویژگی استفاده کرد مشاهده نمایید.
| مقدار | توضیح |
|---|---|
| color | رنگ بوردر پایین یک عنصر را مشخص میکند. میتوانید از انواع روش های رنگدهی استفاده نمایید. مثله نام رنگ یا کد hex یا کد rgb و .. ( آموزش رنگ ها را مشاهده نمایید ) ( پیش فرض، رنگ متن همان عنصر میباشد ) |
| transparent | رنگ بوردر پایین عنصر شفاف میشود. ( بدون رنگ ) |
| initial | استفاده از مقدار پیش فرض یا اولیه | اطلاعات بیشتر |
| inherit | استفاده از مقدار پدر یا والد ( به ارث بری ) | اطلاعات بیشتر |
Free-Learn
نکات و توضیحات
یک بوردر یا Border تا استایل نداشته باشد در مرورگر هیچ نمای بصری نخواهد داشت، پس در نتیجه حتما باید استایل بوردر را هم مشخص نمایید.
مجموعه ای از نام رنگ ها از اینجا مشاهده نمایید و مجموعه ای از کدهای HEX را از اینجا و مجموعه ای از کدهای RGB را از اینجا مشاهده نمایید.
