المان های HTML

در این جلسه قصد داریم که بخش چهارم از آموزش HTML 5 از طریق وب سایت w3schools.com را خدمت شما عزیزان ارائه دهیم.
در ابتدا وارد w3schools.com شده و از بخش آموزش HTML و از منوی سمت چپ لینک HTML Elements را کلیک می کنیم.

هر کدام از المان های HTML معمولا از تگ آغازین، تگ پایانی به علاوه محتوا تشکیل می شود.
```
<tagname>Content goes here...</tagname>
```
این نکته را یادآوری کنم که به طور مصطلح به المان های HTML “تگ” هم گفته می شود. اگر جایی به جای المان از کلمه “تگ” استفاد کردیم، منظور همان تگ کامل هست، یعنی بخش آغازین، محتوا و بخش پایانی.
هر المان HTML هر چیزی از تگ آغازین تا تگ پایانی را شامل می شود.
```
<p>My first paragraph.</p>
```

در جدول زیر چند نمونه از المان های HTML را می بینید.

Start tag	Element content	End tag
<h1>	My First Heading	</h1>
<p>	My first paragraph.	</p>
<br>

اگر دقت کنید می بینید که تگ <br> با تگ های <h1> و <p> تفاوت دارد که توضیحاتش را در ادامه، خدمتتان عرض خواهیم کرد.

المان های تو در تو

المان های HTML می توانند درون همدیگر قرار بگیرند و همه document های HTML از المان های تو در تو تشکیل شده اند.
در سند HTML زیر می توانید ببینید که تگ های <h1> و <p> درون تگ <body> و تگ <body> درون تگ <html> قرار گرفته است که به این مفهوم nested elements (المان های تو در تو) گفته می شود.

<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>
<p>My first paragraph.</p>

</body>
</html>

تگ body

تگ <body> بدنه سند HTML را تعریف می کند و درواقع همان قسمت هایی از سند است که ما آن را در صفحه مرورگر می بینیم.

تگ h1

تگ <h1> برای تعریف عنوان های (heading) بزرگ و مهم تر استفاده می شود که همچون دیگر تگ های HTML شامل: تگ آغازین، تگ پایانی و محتوا می شود. که در مثال بالا، محتوا my first heading است.

تگ p

تگ <p> برای تعریف پاراگراف استفاده می شود که باز هم مانند تگ <h1> شامل: تگ آغازین، تگ پایانی و محتوا (my first paragraph) می شود.

تگ پایانی را فراموش نکنید

<html>
<body>

<p>This is a paragraph
<p>This is a paragraph

</body>
</html>

اگر تگ پایانی را مانند مثال بالا ننویسیم؛ ممکن است مرورگر از ما هیچ خطایی نگیرد و سند را به درستی نمایش دهد؛ اما گاهی مواقع مشکلاتی را به وجود می آورد و باعث می شود که صفحات ما به درستی نمایش داده نشوند.

المان های خالی (Empty elements)

المان های خالی المان هایی هستند که تگ پایانی ندارند و فقط از تگ آغازین تشکیل شده اند.

تگ br

تگ هایی شبیه تگ <br> تگ های خالی نامیده می شوند.
تگ <br> باعث می شود که خط بشکند و بقیه محتوا به خط بعد برود.
المان های خالی می توانند در تگ آغازین بسته شوند. به این صورت که یک اسلش (/) را بعد از نام تگ قرار می دهیم </br>.
در HTML5 نیازی به بستن تگ های خالی نیست اما اگر بخواهیم که یک اعتبارسنجی (validation) سخت تری را روی سند خود ایجاد کنیم و بخواهیم سند ما از طریق parser های xml قابل خواندن باشد، باید همه تگ های HTML را به درستی ببندیم.

در XHTML که یکی از نسخه های قبلی HTML بود، باید به اجبار از قوانین XML پیروی می کردیم. اما در HTML5 هیچ نیازی به این کار نیست.

اچ تی ام ال case sensitive نیست

به این معنی که بزرگی و کوچکی حروف هیچ اهمیتی ندارد و می توانیم <p> را به صورت <P> نیز بنویسیم.
اما ما توصیه می کنیم از حروف کوچک استفاده کنید چون به عنوان مثال در سندهایی از جنس XHTML نیاز است که ما حروف را به صورت کوچک بنویسیم و اجباری است.
این بخش از آموزش نیز به پایان رسید. از این که با ما همراه بودید، تشکر می کنم.