عناوین در HTML بسیار مهم هستند.
تگ های عنوان در HTML
عنوان ها با تگ های <h1> تا <h6> تعریف می شوند.
زبان سند با ویژگی lang در تگ <html> اعلام می شود.
تگ <h1> به عنوان مهم ترین عنوان محسوب شده و سایر تگ ها از <h2> تا <h6> به ترتیب درجه اهمیت کمتری دارند.
<h1>این یک عنوان از نوع اول است</h1>
<h2>این یک عنوان از نوع دوم است</h2>
<h3>این یک عنوان از نوع سوم است</h3>
خودتان آزمایش کنید »
توجه: مرورگر شما هنگام خواندن تگ های عنوان به صورت خودکار فضای خالی پیش فرضی پیش و پس از عنوان برای ایجاد فاصله با متن قبل و بعد از آن در نظر می گیرد.
جداکننده افقی HTML
تگ <hr> یک خط افقی در صفحه HTML شما ایجاد می کند.
از این المان می توان به عنوان جداکننده چند محتوای مختلف استفاده کرد:
مثال
<p>این یک پاراگراف است.</p>
<hr>
<p>این یک پاراگراف دیگر است.</p>
<hr>
<p>و این یکی هم یک پاراگراف دیگر است.</p>
خودتان آزمایش کنید »
المان <head> در HTML
المان یا تگ <head> هیچ ارتباطی به عنوان درون صفحات HTML ندارد.
المان <head> حاوی داده هایی هستند که در مرورگر HTML نمایش داده نمی شود و در خود اطلاعاتی مثل داده های Meta را قرار می دهد که درباره آن خواهید خواند.
المان <head> که از دو تگ باز و بسته با همین نام تشکیل شده است بین تگ آغازین <html> و تگ آغازین <body> نوشته می شود.
مثال
<!DOCTYPE html>
<html>
<head>
<title>نخستین صفحه وب من</title>
<meta charset="UTF-8">
</head>
<body>
.
.
.
خودتان آزمایش کنید »
 |
متا دیتا (Meta data) یعنی اطلاعاتی درباره داده های موجود در سند صفحه HTMLی که می نویسیم. |
المان <title> در HTML
المان یا تگ <title> یک Meta data محسوب می شود که کار آن تعریف یک عنوان برای صفحه HTML شما هنگامی که در مرورگر نمایش داده می شود است.
تگ <title> هرگز در محتوای سند HTML شما نمایش داده نمی شود. تنها در بالای مرورگر شما در قسمت title و یا تب (Tab)های مرورگر شما قابل مشاهده است.
سایر المان های Meta
در درس های بعدی که درباره سبک (Style) در HTML توضیح خواهیم داد بیشتر درباره سایر المان های Meta توضیح خواهیم داد:
از این تگ برای مشخص کردن ساختار کاراکترهایی که در سند HTML استفاده شده است و همچنین سایر اطلاعات مهم دیگر استفاده می شود.
المان <meta> در HTML
المان یا تگ <meta> نیز یک Meta data است.
المان یا تگ <style> برای ایجاد کدهای CSS داخلی در سند HTML استفاده می شود که برای معرفی ویژگی های ظاهری تگ های HTML (در آینده به این موضوع خواهیم پرداخت) استفاده می شود.
المان یا تگ <link> برای فراخوانی یک سند از نوع CSS از خارج از سند HTML استفاده می شود. کد های css برای تغییر در ظاهر تگ های HTML استفاده می شود که در بخش آموزش CSS روش استفاده از این دستورات آموزش داده می شود.
نکته، چگونه سورس کد یک صفحه HTML را مشاهده کنیم؟
آیا تا به حال یک صفحه وب را دیده اید که از آن متعجب شده باشید و از خود پرسیده باشید که "وای... این صفحه را چطور ساختند؟"
خیلی ساده است، تنها کافی است روی جای خالی از صفحه HTMLی که می بینید کلیک راست (Right Click) کنید و اگر مرورگر شما Chrome است روی گزینه "View Page Source" کلیک کنید، اگر مرورگر شما I.E. یا همان اینترنت اکسپلورر (مرورگر پیش فرض ویندوز) است روی گزینه "View Source" کلیک کنید و روند مشابهی در سایر مرورگر ها نیز وجود دارد که می تواند سورس کدهای نوشته شده HTML را به شما نشان بدهد. با این کار یک صفحه جدید که شامل کد های تشکیل دهنده آن صفحه است توسط مرورگر شما باز خواهد شد.
مرجع تگ ها و المان های HTML
در زیر جدولی از عناصر، المان ها یا همان تگ های HTML را ملاحظه می فرمایید که مربط به دسته بندی تک های عنوان می شود. در فصل های بعد تگ های دیگر آموزش داده می شود.
| نام تگ HTML |
توضیح درباره تگ HTML |
| <html> |
یک سند HTML را تعریف می کند |
| <body> |
منطقه بدنه محتوایی سند HTML را تعریف می کند |
| <head> |
منطقه مربوط به عناوین و تعریف خصوصیات سند HTML را تعریف می کند |
| <h1> to <h6> |
عناوین با شش درجه اهمیت زیاد تا کم را در متن محتوای سند HTML را تعریف می کنند |
| <hr> |
یک خط افقی جدا کننده را در بخش محتوای سند HTML تعریف می کند |