تنظیم لبه ها، به صورت جداگانه

در CSS این امکان وجود دارد که برای اضلاع مختلف، لبه های مختلف تعریف کرد.

مثال (تنظیم لبه ها، به صورت جداگانه در CSS)

p
{
border-top-style:dotted;
border-right-style:solid;
border-bottom-style:dotted;
border-left-style:solid;
}
خودتان امتحان کنید »

مثال بالا را می توان با یک خاصیت نیز تنظیم کرد:

مثال (تنظیم لبه ها، به صورت جداگانه در CSS)

border-style:dotted solid;
خودتان امتحان کنید »

خاصیت border-style از یک تا چهار مقدار می تواند داشته باشد:

  1. border-style:dotted solid double dashed;
    • dotted لبه بالا
    • solid لبه راست
    • double لبه پایین
    • dashed لبه چپ
  2. border-style:dotted solid double;
    • dotted لبه بالا
    • solid لبه راست و چپ
    • double لبه پایین
  3. border-style:dotted solid;
    • dotted لبه بالا و پایین
    • solid لبه راست و چپ
  4. border-style:dotted;
    • dotted تمام چهار لبه

آنچه در مورد خاصیت border-style در بالا گفته شد در مورد خاصیت های border-width و border-color نیز استفاده می شود.

آموزش های مرتبط

آموزش CSS-خاصیت border