الاختلافات بين مستوى الكتلة والعناصر المضمنة

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

عناصر مستوى الكتلة

إذن ما هو عنصر مستوى الكتلة؟ عنصر مستوى الكتلة هو عنصر HTML يبدأ سطرًا جديدًا على صفحة ويب ويمتد العرض الكامل للمساحة الأفقية المتاحة لعنصره الأصلي. يقوم بإنشاء كتل كبيرة من المحتوى مثل الفقرات أو أقسام الصفحات. في الواقع ، معظم عناصر HTML هي عناصر على مستوى الكتلة.

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

العناصر المضمنة

على عكس عنصر على مستوى الكتلة ، عنصر مضمن:

يمكن أن تبدأ ضمن خط.
لا يبدأ سطر جديد.
يمتد عرضه بقدر ما يتم تحديده بواسطة علاماته.

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

يوجد أيضًا نوع ثالث من العناصر في HTML: العناصر التي لم يتم عرضها على الإطلاق. توفر هذه العناصر معلومات حول الصفحة ولكن لا يتم عرضها عند عرضها في مستعرض ويب.

instagram viewer

على سبيل المثال:

يعرّف البيانات الوصفية.
هو عنصر مستند HTML الذي يحتوي على هذه العناصر.

تبديل أنواع العناصر المضمنة والكتل

يمكنك تغيير نوع عنصر من مضمّن إلى منع ، أو العكس ، باستخدام إحدى خصائص CSS التالية:

```
العرض محجوب؛ 
```
```
عرض: مضمنة ؛ 
```
```
عرض لا شيء؛
```

ال CSS تتيح لك خاصية display تغيير خاصية مضمنة للحظر ، أو كتلة إلى مضمنة ، أو لا للعرض على الاطلاق.

متى يتم تغيير خاصية العرض

بشكل عام ، اترك خاصية العرض بمفردها ، ولكن هناك بعض الحالات التي يمكن أن يكون فيها تبديل خصائص العرض المضمنة والكتل مفيدًا.

قوائم القوائم الأفقية: القوائم هي عناصر على مستوى الكتلة ، ولكن إذا كنت تريد عرض قائمتك أفقيًا ، فأنت بحاجة إلى تحويل القائمة إلى عنصر مضمن بحيث لا يبدأ كل عنصر من عناصر القائمة في سطر جديد.
الرؤوس في النص: في بعض الأحيان قد ترغب في بقاء الرأس في النص ، مع الحفاظ على قيم رأس HTML. سيؤدي تغيير قيم h1 إلى h6 إلى مضمنة إلى السماح للنص الذي يأتي بعد علامة الإغلاق بمواصلة التدفق بجواره على نفس السطر ، بدلاً من البدء في سطر جديد.
إزالة العنصر: إذا كنت تريد إزالة عنصر بالكامل من المستند التدفق الطبيعي، يمكنك ضبط العرض على
```
لا أحد
```
ملاحظة واحدة ، كن حذرًا عند استخدام العرض: لا شيء. في حين أن هذا النمط سيجعل عنصرًا غير مرئي بالفعل ، فأنت لا تريد أبدًا استخدام هذا لإخفاء النص الذي أضفته لأسباب تحسين محركات البحث ، ولكن لا تريد عرضه للزوار. هذه طريقة مؤكدة لمعاقبة موقعك على نهج القبعة السوداء لتحسين محركات البحث.

الأخطاء الشائعة في تنسيق العناصر المضمنة

أحد الأخطاء الأكثر شيوعًا التي يرتكبها الوافد الجديد لتصميم الويب هو محاولة تعيين عرض على عنصر مضمن. هذا لا يعمل لأنه لم يتم تحديد عرض العناصر المضمنة بواسطة مربع الحاوية.

تتجاهل العناصر المضمنة العديد من الخصائص:

```
العرض
```
و
```
ارتفاع
```
```
أقصى عرض
```
و
```
اقصى ارتفاع
```

العرض الأدنى

أدنى ارتفاع

قام Microsoft Internet Explorer (الذي تم استبداله بـ Microsoft Edge) في الماضي بتطبيق بعض هذه الخصائص بشكل غير صحيح حتى على المربعات المضمنة. هذا لا يتوافق مع المعايير. قد لا يكون هذا هو الحال مع الإصدارات الأحدث من مستعرض ويب Microsoft.

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