شرح خاصية Outline

خاصية outline في CSS تستخدم لإضافة خط خارجي يحيط بحدود العنصر، وهو مفيد لتحديد العنصر المحدد أو لإضافة تأثيرات بصرية إلى العنصر. يتم عرض الـ outline فوق الحواف والحدود الحالية للعنصر.

يمكن تعيين القيمة لـ outline باستخدام العديد من الخصائص، مثل اللون والعرض والنمط والتصميم، ويمكن استخدام القيم الثابتة ووحدات القياس المختلفة.

الامثلة:

  • لإضافة خط خارجي لعنصر div باللون الأحمر، يمكن استخدام الشفرة التالية:
div {
  outline: 2px solid red;
}
  • لإضافة خط خارجي لعنصر button باللون الأزرق وعرض 3 بكسل، يمكن استخدام الشفرة التالية:
button {
  outline: 3px dotted blue;
}
  • لإضافة تأثير توهج لعنصر a عند النقر عليه، يمكن استخدام الشفرة التالية:
a:hover {
  outline: 2px solid #00ff00;
}

يمكن استخدام خاصية outline بشكل مفيد لتحديد العنصر المحدد أو لإضافة تأثيرات بصرية إلى العنصر، ويمكن استخدامها لتحسين تجربة المستخدم في صفحات الويب.