خصائص الحواف المختصرة في CSS

CSS Border - ميزة مختصرة

كما رأيت في الفصل السابق، يجب النظر في العديد من الخصائص عند معالجة الحواف.

لتحسين كود، يمكنك أيضًا تحديد جميع خصائص الحواف الفردية في سطر واحد.

border الخصائص هي اختصارات لخصائص الحواف من كل جانب

  • border-width
  • border-style(مطلوب)
  • border-color

مثال

p {
  border: 5px solid red;
}

النتيجة:

نص بسيط

جرب بنفسك

يمكنك أيضًا تحديد جميع خصائص الحواف الفردية لمجرد حرف واحد:

خط يسار

p {
  border-left: 6px solid red;
  background-color: lightgrey;
}

النتيجة:

نص بسيط

جرب بنفسك

خط أسفل

p {
  border-bottom: 6px solid red;
  background-color: lightgrey;
}

النتيجة:

نص بسيط

جرب بنفسك