border

توسط ویژگی border می توان عرض، نوع و رنگ حاشیه هر چهار سمت یک عنصر را تعریف کرد.

از طریق این ویژگی می توان هر سه ویژگی border-width، border-style و border-color را بطور هم زمان برای هر چهار سمت عنصر تنظیم کرد.

باید توجه داشته باشیم که هر کدام از این سه ویژگی هم کوتاه شده ای برای چهار ویژگی دیگر هستند:

برای بررسی ویژگی های بالا و مقادیر اولیه شان به مطلب مخصوص به آن مراجعه کنید.

 
ویژگی border سه مقدار می پذیرد و اگر هر کدام از مقادیر را تعیین نکنیم به مقدار اولیه اش ریست می شود.


.element {
  border: 1em; /* color = currentColor style = none */

  /* یا */
  border: solid orange; /* width = 0 */

  /* یا */
  border: 1px dotted #eee;

  /* یا */
  border: 5px solid teal;
}

 

همینطور که در مثال های بالا دیده می شود با استفاده از این ویژگی نمی توان فقط حاشیه یک سمت خاص عنصر را تعریف کرد. برای این کار نیاز هست که از ویژگی های مختصر نویسی زیر استفاده کنیم:

 
در دموی زیر حاشیه عنصر را تغییر دهید:

 

See the Pen border by Mojtaba Seyedi (@seyedi) on CodePen.


 

2 دیدگاه برای “border

    1. توی HTML فرقی نمی کنند و از هر کدوم استفاده کنید مشکلی پیش نمیاد ولی همیشه از یکی استفاده کنید. توصیه میشه توی HTML از double quotes استفاده کنید. منظور از دوتاییش استفاده کنید.

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *