العرض - display

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

أنواع أنماط العرض:

• العرض المضمن (inline): يجعل العنصر جزءًا من التدفق الطبيعي للنص، مما يعني أنه لن يبدأ سطرًا جديدًا.
• العرض المنفصل (block): يجعل العنصر يبدأ سطرًا جديدًا ويأخذ العرض الكامل للحاوية الأم.
• العرض المضمن-المنفصل (inline-block): مزيج من العرض المضمن والمنفصل، حيث يسمح للعنصر بالتدفق مع النص ولكنه أيضًا يأخذ عرضه وارتفاعه.
• بدون عرض (none): يجعل العنصر غير مرئي.
• جدول (table): يعرض العنصر في شكل جدول.
• مرن (flex): يضع العناصر في حاوية مرنة، مما يسمح بتغيير حجمها وموضعها تلقائيًا استجابةً لتغييرات حجم الشاشة.
• شبكة (grid): يقسم الحاوية إلى شبكة من الأعمدة والصفوف، مما يسمح بوضع العناصر بدقة.

مثال لسي إس إس لضبط كيفية عرض عنصر:

.element {
  display: inline; /* يجعل العنصر مضمنًا */
  display: block; /* يجعل العنصر منفصلًا */
  display: inline-block; /* يجعل العنصر مضمنًا-منفصلًا */
  display: none; /* يجعل العنصر مخفيًا */
}

تلميحات حول تحسين إمكانية الوصول:

• استخدم نمط العرض "المضمن" للنص لتجنب مقاطعة قراءة شاشة.
• استخدم نمط العرض "المنفصل" للعناوين والعناصر الرئيسية التي تحتاج إلى أن تكون واضحة ومميزة.
• تجنب استخدام نمط العرض "بدون عرض" لإخفاء العناصر التي لا تريد عرضها، لأن ذلك يمكن أن يجعل المحتوى غير قابل للوصول لأجهزة قراءة الشاشة.