HTML <h1> سے <h6> تگ

تعریف اور استعمال

<h1> سے <h6> تگ کا استعمال HTML عنوان کی تعریف کے لئے کیا جاتا ہے.

<h1> مهم ترین عنوان کی تعریف کریں.<h6> سخت ترین عنوان کی تعریف کریں.

توجہ دیں

ہر صفحہ میں صرف ایک <h1> - یہ پورا صفحہ کا اہم عنوان/موضوع کی نمائندگی کرنا چاہئیے. اس کے علاوہ، عنوان کی درجہ بندی کو چھوڑ نہ جائیں - سے <h1> شروع کنید، سپس استفاده کنید <h2>و به همین ترتیب.

به دلیل اینکه عناصر h دارای معنای دقیقی هستند، لطفاً در انتخاب سطوح مناسب برای ساختار مستندات خود دقت کنید. بنابراین، از استفاده از برچسب‌های عنوان برای تغییر اندازه فونت در یک خط خودداری کنید. به جای آن، ما باید از تعریف‌های استایل کلاسیک استفاده کنیم تا به نتایج نمایشی زیبا دست یابیم.

اگر مایلید اطلاعات بیشتری در مورد انتخاب و استفاده از برچسب‌های HTML بدست آورید، لطفاً به کتاب:کیفیت وب》。

لطفاً به:

آموزش HTML:HTML عنوان

دستورالعمل HTML DOM:موضوع

مثال

مثال 1

شش عنوان متفاوت HTML:

<h1>این عنوان 1 است</h1>
<h2>این عنوان 2 است</h2>
<h3>این عنوان 3 است</h3>
<h4>این عنوان 4 است</h4>
<h5>این عنوان 5 است</h5>
<h6>این عنوان 6 است</h6>

خودتان امتحان کنید

مثال 2

تنظیم رنگ پس‌زمینه و رنگ متن عنوان (از طریق CSS):

<h1 style="background-color:DodgerBlue;">Hello World</h1>
<h2 style="color:Tomato;">Hello World</h2>

خودتان امتحان کنید

مثال 3

تنظیم نحوه قرارگیری عنوان (از طریق CSS):

<h1 style="text-align:center">این عنوان 1 است</h1>
<h2 style="text-align:left">این عنوان 2 است</h2>
<h3 style="text-align:right">این عنوان 3 است</h3>
<h4 style="text-align:justify">این عنوان 4 است</h4>

خودتان امتحان کنید

خصوصیات جهانی

<h1> - <h6> البرچسب‌ها نیز از خصوصیات رویداد پشتیبانی می‌کنند خصوصیات جهانی در HTML。

خصوصیات رویداد

<h1> - <h6> البرچسب‌ها نیز از خصوصیات رویداد پشتیبانی می‌کنند خصوصیات رویداد در HTML。

تنظیمات CSS پیش‌فرض

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <h1> عنصر:

مثال 1

h1 {
  display: block;
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

خودتان امتحان کنید

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <h2> عنصر:

مثال 2

h2 {
  display: block;
  font-size: 1.5em;
  margin-top: 0.83em;
  margin-bottom: 0.83em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

خودتان امتحان کنید

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <h3> عنصر:

مثال 3

h3 {
  display: block;
  font-size: 1.17em;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

خودتان امتحان کنید

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <h4> عنصر:

مثال 4

h4 {
  display: block;
  font-size: 1em;
  margin-top: 1.33em;
  margin-bottom: 1.33em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

خودتان امتحان کنید

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <h5> عنصر:

مثال 5

h5 {
  display: block;
  font-size: .83em;
  margin-top: 1.67em;
  margin-bottom: 1.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

خودتان امتحان کنید

بیشتر مرورگرها از مقادیر پیش‌فرض زیر برای نمایش استفاده می‌کنند <h6> عنصر:

مثال 6

h6 {
  display: block;
  font-size: .67em;
  margin-top: 2.33em;
  margin-bottom: 2.33em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

خودتان امتحان کنید

پشتیبانی از مرورگر

کروم ایندوز فایرفاکس سافاری اپرا
کروم ایندوز فایرفاکس سافاری اپرا
پشتیبانی پشتیبانی پشتیبانی پشتیبانی پشتیبانی