أتذكر سؤالًا طرحه القائم بإجراء المقابلة خلال مقابلة العمل السابقة: ما هي العناصر في الصناعة وما هو الفرق بينها وعناصر مستوى الكتلة؟ هذا سؤال مقابلة أساسي للغاية ، لكن العديد من المبتدئين عادة ما يركزون فقط على دلالات الملصقات ويتجاهلون خصائص الملصقات داخل مستوى الكتلة. لذلك ، من المحتمل جدًا أنه لا يمكن الإجابة على الأسئلة أعلاه أو الإجابة عليها بشكل غير مكتمل.
العناصر المشتركة في الخط في HTML هي:<span> ، <a> ، <img> ، <prope> ، <evidea> ، <select> ، <label>
ويتضمن أيضًا بعض العناصر النصية مثل: <br> ، <b> ، <strong> ، <sup> ، <sub> ، <i> ، <em> ، <del> ، <u> ، إلخ.
إذا أجبت فقط <span> و <img> ، فسيكون ذلك غير معقول.
العناصر الشائعة على مستوى الكتلة في HTML هي:<viv> ، <الطاولة> ، <form> ، <p> ، <ul> ،
<h1> ...... <h6> ، <hr> ، <pre> ، <address> ، <centre> ، <marquee> ، <blockquote> ، إلخ.
إذا أجبت فقط <div> ، فسيكون ذلك غير معقول.
إذن ما هو الفرق بينهما؟عناصر على مستوى الكتلة
1. ابدأ دائمًا بخط جديد ، أي أن كل عنصر على مستوى الكتلة يأخذ سطرًا واحدًا ، ويتم ترتيبه لأسفل بشكل افتراضي ؛
2. الارتفاع والعرض والهامش والحشو كلها قابلة للتحكم ، مع إعدادات فعالة وتأثيرات الهامش ؛
3. عندما لا يتم تعيين العرض ، يكون الافتراضي 100 ٪ ؛
4. يمكن أن تحتوي العناصر على مستوى الكتلة على عناصر على مستوى الكتلة والعناصر الموجودة في الخط.
· العناصر في الخط
1. في نفس الخط مثل العناصر الأخرى ، أي أن العناصر الموجودة في الخط والعناصر الأخرى في الخط سيتم ترتيبها على خط أفقي ؛
2. الارتفاع والعرض لا يمكن السيطرة عليهما ، والإعدادات غير صالحة وتحددها المحتوى.
تحديد هامش الإعداد فعال على اليسار واليمين ، مع تأثير الهامش ؛
لن يدعم الهامش إعداد المساحة لأعلى ولأسفل تأثيرات الهامش (أي ، على قمة الهامش/القاع لها قيم على نموذج المربع ، ولكن لا يوجد تأثير هامش على الصفحة).
وضع حشوة اليسار واليمين فعال. سيجعل وضع الحشو لأعلى ولأسفل أكبر مساحة ولكن لن ينتج عنه تأثير هامش (كما هو مذكور أعلاه).
يظهر تأثير الحشو على النحو التالي:
<! doctype html> <html> <head> <meta charset = utf-8> </head> <style> span {border: 1px solid red ؛ padding: 10px ؛} div {border: 1px solid blue ؛ العنصر </div> </body> </html>3. وفقًا لمفهوم دلالات الملصقات ، من الأفضل تضمين العناصر الموجودة في الخط فقط وليس عناصر على مستوى الكتلة.
يتحولبالطبع ، يمكن تحويل الخصائص بين العناصر على مستوى الكتلة والعناصر الموجودة في الخط إلى بعضها البعض. يمكن لـ HTML تقسيم العناصر إلى ثلاثة أنواع: عناصر في الصف ، وعناصر الحظر وعناصر الكتلة داخل الصف.
استخدم سمة العرض لتحويل الثلاثة إلى تحويل تعسفي:
(1) العرض: مضمّن ؛ تحويل إلى عناصر مضمنة ؛
(2) العرض: كتلة ؛ تحويل إلى حظر العناصر ؛
(3) العرض: كتلة مضمنة ؛ تحويل إلى عناصر كتلة مضمنة.
تجمع عناصر الكتلة داخل الخط خصائص العناصر الموجودة في الخط والعناصر الموجودة في الخط:(1) إذا لم يتم لف غلاف الخط تلقائيًا ، فسيتم ترتيبه على خط أفقي مع عناصر خطية أخرى ؛
(2) الطول والعرض والهامش والحشو كلها قابلة للتحكم ، مع إعدادات فعالة وتأثيرات الهامش ؛
(3) الترتيب الافتراضي من اليسار إلى اليمين.
هذه هي نهاية هذه المقالة حول تفاصيل ما هي الاختلافات بين عناصر HTML والعناصر على مستوى الكتلة. لمزيد من عناصر HTML ذات الصلة والعناصر على مستوى الكتلة ، يرجى البحث عن المقالات السابقة من Wulin.com أو متابعة تصفح المقالات ذات الصلة أدناه. آمل أن يدعم الجميع wulin.com في المستقبل!