HTML <h1> hanggang <h6> tag

tukuyin at paggamit

<h1> sa <h6> ang tag na ginamit upang tukuyin ang HTML pamagat.

<h1> tukuyin ang pinakamahalaga sa mga pamagat.<h6> tukuyin ang pinakamahina sa mga pamagat.

pansin

isang pahina lamang ang gumagamit ng <h1> - ito ay dapat maglalarawan bilang ang pangunahing pamagat/tema ng buong pahina. Gayundin, huwag manghulog sa antas ng pamagat - mula sa <h1> magsimula, pagkatapos ay gamitin <h2>at sa gayon pa rin.

Dahil ang mga h elemento ay may tiyak na semantika, mangyaring maingat sa pagpili ng tamang antas ng tag upang bumuo ng struktur ng dokumento. Kaya, huwag gamitin ang tag na title upang baguhin ang laki ng font sa parehong linya. Sa halip, gamitin natin ang CSS sa paglalarawan ng magandang pagdisenyong display.

Kung gusto mong magkaalam pa ng higit pa tungkol sa pagpili at paggamit ng HTML tag, basahin angWeb Quality》。

Mga ibang Basahin:

HTML Tutorial:HTML หัวข้อ

HTML DOM Reference Manual:Object na Heading

Mga Halimbawa

Mga Halimbawa 1

Anim na iba't ibang HTML Title:

<h1>Ang Titulo 1</h1>
<h2>Ang Titulo 2</h2>
<h3>Ang Titulo 3</h3>
<h4>Ang Titulo 4</h4>
<h5>Ang Titulo 5</h5>
<h6>Ang Titulo 6</h6>

ทดลองด้วยตัวเอง

Mga Halimbawa 2

Iset ng kulay ng background at text ng titulo (gamit ang CSS):

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

ทดลองด้วยตัวเอง

Mga Halimbawa 3

Iset ng alinhamento ng titulo (gamit ang CSS):

<h1 style="text-align:center">Ito ay Titulo 1</h1>
<h2 style="text-align:left">Ito ay Titulo 2</h2>
<h3 style="text-align:right">Ito ay Titulo 3</h3>
<h4 style="text-align:justify">Ito ay Titulo 4</h4>

ทดลองด้วยตัวเอง

Global Properties

<h1> - <h6> Ang tag na ito ay sumusuporta sa Global Properties sa HTML

Event Properties

<h1> - <h6> Ang tag na ito ay sumusuporta sa Event Properties sa HTML

Default na CSS Settings

โดยทั่วไป บราวเซอร์จะแสดงค่าเริ่มต้นตามต่อไปนี้ <h1> องค์ประกอบ:

Mga Halimbawa 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> องค์ประกอบ:

Mga Halimbawa 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> องค์ประกอบ:

Mga Halimbawa 3

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

ทดลองด้วยตัวเอง

โดยทั่วไป บราวเซอร์จะแสดงค่าเริ่มต้นตามต่อไปนี้ <h4> องค์ประกอบ:

Mga Halimbawa 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;
}

ทดลองด้วยตัวเอง

การสนับสนุนเบราเซอร์

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
สนับสนุน สนับสนุน สนับสนุน สนับสนุน สนับสนุน