الخاصية display في CSS | الدرس 23\37

    السلام عليكم، سنرى في هذا الدرس الخاصية 'DISPLAY' و قيمها.

ما هي الخاصية DISPLAY ؟

   الخاصية 'DISPLAY' هي خاصية مسؤولة عن تحديد كيفية ظهور العناصر HTML في صفحات الويب، و لديها قيم كثيرة لكن أغلبها قد تم تعويضها بعناصر HTML مخصصة من طرف النسخة الأخيرة للـ HTML التي هي HTML5، و ما سندرسه في هذا الدرس هم أربع أهم قيم للخاصية 'DISPLAY' حيث تعتبر أكثر قيم الخاصية استعمالاً من طرف مصممو الويب، و هم :

* INLINE

* BLOCK

* INLINE-BLOCK

* NONE

الفيديو التوضيحي للدرس

قيم الخاصية DISPLAY

القيمة INLINE

   تجعل القيمة INLINE عناصر HTML من نوع Block تظهر كعناصر من نوع INLINE مع عدم إمكانية التعديل على أبعادها، أي عرضها و ارتفاعها.

القيمة BLOCK

   تجعل القيمة BLOCK عناصر HTML من نوع INLINE تظهر كعناصر من نوع Block.

القيمة INLINE-BLOCK

  تجعل القيمة INLINE-BLOCK عناصر HTML كيفما كان نوعها تظهر كعناصر من نوع Inline آخذة خصائص Block، أي يمكن التعديل عليها أو إقحام عناصر HTML أخرى في محتواها.

القيمة NONE

    تجعل القيمة NONE عناصر HTML تختفي من صفحة الويب المتواجدة فيها.

See the Pen
الخاصية display by osama (@webdesigner7)
on CodePen.

الأكواد المستعملة في الدرس

أتمنى أن تستفيدوا من الدرس