Τα ετικέτες HTML <h1> έως <h6>

  • Προηγούμενη Σελίδα <frameset>
  • Επόμενη Σελίδα <head>

Ορισμός και χρήση

<h1> μέχρι <h6> Οι ετικέτες χρησιμοποιούνται για τη διαμόρφωση των τίτλων HTML.

<h1> Ορίστε τον πιο σημαντικό τίτλο.<h6> Ορίστε τον λιγότερο σημαντικό τίτλο.

Σημείωση

Κάθε σελίδα χρησιμοποιεί μόνο έναν <h1> - Αυτό θα πρέπει να αντιπροσωπεύει τον κύριο τίτλο/θέμα της ολόκληρης σελίδας. Επιπλέον, μη αγνοήσετε τα επίπεδα τίτλων - από <h1> 开始,然后使用 <h2>,以此类推。

由于 h 元素拥有确切的语义,因此请您慎重地选择恰当的标签层级来构建文档的结构。因此,请不要利用标题标签来改变同一行中的字体大小。相反,我们应当使用层叠样式表定义来达到漂亮的显示效果。

如果您希望了解更多有关 HTML 标签选择和使用的信息,请阅读《Web 品质》。

另请参阅:

HTML 教程:Τίτλοι HTML

HTML DOM 参考手册:Heading 对象

实例

例子 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;
}

Δοκιμάστε το Διάφορα

Υποστήριξη Βrowser

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη
  • Προηγούμενη Σελίδα <frameset>
  • Επόμενη Σελίδα <head>