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