نحوه نمایش المان های HTML
نحوه نمایش المان های HTML دو نوع است :
- بلوکی ( block )
- درون خطی ( inline )
المان های HTML به صورت پیشفرض block-level و یا به صورت inline-level هستند.
block-level : المان هایی که نحوه نمایششان به صورت block-level است فضای تمام سطر را اشغال می کنند.
inline-level : المان هایی که نحوه نمایششان به صورت inline-level است، فقط به اندازه ای که فضا نیاز دارند جا می گیرند.
در ادامه بیشتر با این مبحث آشنا می شویم.
بلوک ها
بلوک : بلوک ها همیشه از یک سطر جدید شروع می شوند.
یک المان بلوک همیشه تمام عرض صفحه را اشغال می کند.
دو المان بلوک رایج div و p هستند.
<div>hello my division</div>
<p>hello my pragraph</p>در جدول زیر لیست برخی تگ های بلوکی را مشاهده می کنید :
| <section> | <ol> | <main> | <header> | <footer> | <fieldset> | <div> | <blockquote> | <address> |
|---|---|---|---|---|---|---|---|---|
| <table> | <p> | <nav> | <hr> | <figcaption> | <dl> | <canvas> | <article> | |
| <video> | <noscript> | <li> | <figure> | <dt> | <dd> | <aside> |
تگ های درون خطی
درون خطی ها : المان های درون خطی بر خلاف المان های بلوکی از خط جدید شروع نمیشوند.
المان های درون خطی به اندازه ای که لازم دارند فضا اشغال می کنند.
<i>my italic</i>
<b>my bold</b>در جدول زیر لیست برخی تگ های درون خطی را مشاهده می کنید :
| <textarea> | <span> | <samp> | <map> | <code> | |||
|---|---|---|---|---|---|---|---|
| <time> | <strong> | <script> | <object> | <dfn> | <abbr> | ||
| <tt> | <sub> | <select> | <output> | <kbd> | <button> | <b> | |
| <var> | <sup> | <q> | <label> | <i> | <cite> | <bdo> |
خلاصه درس
- در این بخش با المان های بلوکی و درون خطی آشنا شدید.
- همچنین لیست تگ های درون خطی و بلوکی را مشاهده کردید.
احسان اسلامی
