عناصر بلوکی در HTML

هر عنصر HTML بسته به اینکه چه عنصری باشد، یا یک عنصر بلوکی(block) است یا یک عنصر درون خطی(inline).

بررسی عناصر بلوکی(Block-level) در HTML

یک عنصر بلوکی، همواره در یک خط جدید شروع می شود و تمام عرض در دسترس را اشغال می کند(تا جای امکان، از چپ به راست کشیده می شود).

<div>سلام بر شما</div>

انواع عناصر بلوکی در HTML

عناصر بلوکی در HTML عبارتند از:

بررسی عناصر درون خطی

عناصر درون خطی، در یک جدید جدید ایجاد نمی شوند و تنها عرض لازم برای خود را اشغال می کنند.

عناصر درون خطی عبارتند از:

بررسی عنصر <div>

از عنصر <div> اغلب بعنوان یک ظرف برای دیگر عناصر HTML استفاده می شود. عنصر <div> نیازی به خصوصیت ها ندارد اما معمولاً از خصوصیت های style و class و id در آن استفاده می شود. وقتی که عنصر <div> به همراه کدها مورد استفاده قرار گیرد، می توانیم یک بلوک از محتوا را در درون آن استایل دهی کنیم.

<div style="background-color:black;color:white;padding:20px;">
  <h2>شهر شیراز</h2>
  <p>شهر شیراز مرکز استان فارس و پنجمین شهر بزرگ و پر جمعیت ایران است. مساحت آن تقریبا معادل 240 متر مربع بوده وجمعیت آن معادل 1565572 نفراست.</p>
</div>

استفاده از عنصر <span>

از عنصر <span> اغلب بعنوان یک ظرف برای متن ها استفاده می شود. عنصر <span> هیچ خصوصیت ضروری ندارد، اما معمولاً از خصوصیت های class و id برای آن استفاده می شود. وقتی که از این عنصر به همراه کدهای CSS استفاده شود، به کمک آن می توانیم بخش هایی از متون را استایل دهی کنیم:

<h1>این یک <span style="color:red">عنوان مهم</span> است</h1>