تگ h1 تا h6 در html

تگ‌های <h1>تا <h6> از جمله مهمترین عناصر html از نظر سئو بوده که برای تعریف سرفصل های یک صفحه به کار می‌روند. تگ h1 مهمترین عنوان، h6 کم اهمیت‌ترین عنوان یا سرفصل را تعریف می کند. توجه داشته باشید در یک صفحه از تگ h1 به تعداد بالا استفاده نکنید، به طور معمول از این تگ برای عنوان سایت و یا عنوان مطلب استفاده می‌شود.

نحوه استفاده از تگ <h1> تا <h6>

↑

هنگامی که از سرفصل‌ها در صفحه خود استفاده می‌کنید باید سلسله مراتب استفاده از عناوین نیز رعایت شود، برای مثال هیچگاه پس از تگ h2 از h3 استفاده نکنید.

<!DOCTYPE html>
<html lang="en">
	<head>
  		<title>Heading Tags</title>
	</head>
	<body>
		<h1>This is heading 1</h1>
		<h2>This is heading 2</h2>
		<h3>This is heading 3</h3>
		<h4>This is heading 4</h4>
		<h5>This is heading 5</h5>
		<h6>This is heading 6</h6>
	</body>
</html>

See the Pen H1-H6 Html Tags by Hamgam Web (@Hamgam-Web) on CodePen.

attribute یا ویژگی‌های قابل استفاده در تگ‌های <h1> تا <h6>

↑

h1-h6 می‌توانند دارای چندین ویژگی یا attribute باشند که استفاده از این ویژگی‌ها اختیاری است.

Global Attributes

↑

تگ‌های <h1> تا <h6> همچنین از Global Attributes در HTML پشتیبانی می کنند.

ویژگی‌های ظاهری پیشفرض در تگ‌های <h1> تا <h6>

↑

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

h1, h2, h3, h4, h5, h6{
  display: block;
  font-weight: bold;
}

تگ <h1>

↑
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

تگ <h2>

↑
h2 {
  font-size: 1.5em;
  margin: 0.83em 0;
}

تگ <h3>

↑
h3 {
  font-size: 1.17em;
  margin: 1em 0;
}

تگ <h4>

↑
h4 {
  font-size: 1em;
  margin: 1.33em 0;
}

تگ <h5>

↑
h5 {
  font-size: 0.83em;
  margin: 1.67em 0;
}

تگ <h6>

↑
h2 {
  font-size: 0.67em;
  margin: 2.33em;
}

آموزش خصوصی طراحی سایت و وردپرس به صورت آنلاین

پروژه محور - ارتباط مستقیم با مدرس

ثبت نامتعرفه آموزش خصوصی