語義化標簽是什么？常見的語義化標簽

語義化標簽是什么？

語義化標簽是HTML5的新特性，讓標簽有自己的含義。

優點

1. 使代碼結構清晰，有利於團隊開發。
2. 便於各種設備解析，如屏幕閱讀器等，以語義的方式渲染頁面
3. 利用搜索引擎優化

常見的語義化標簽

• <title>：頁面主體內容。
• <hn>：h1~h6，分級標題，<h1> 與 <title> 協調有利於搜索引擎優化。
• <ul>：無序列表。
• <li>：有序列表。
• <header>：頁面。通常包括網站標志、主導航、全站鏈接、搜索框。
• <nav>：標記導航。僅對頁面中重要的鏈接群使用。
• <main>：頁面主要內容，一個頁面只能使用一次。如果是web服務應用，
• <article>：定義外部的內容，其中的內容獨立於文檔的其余部分。
• <section>：定義文檔中的節（section、區段）。比如章節、頁眉、頁腳或文檔中的其他部分。
• <aside>：定義其所處內容之外的內容。如側欄、文章的一組鏈接、廣告、友情鏈接、相關產品列表等。
• <footer>：頁腳，只有當父級是body時，才是整個頁面的頁腳。
• <small>：呈現小號字體效果，指定細則，輸入免責聲明、注解、署名、版權。
• <strong>：和 em 標簽一樣，用於強調文本，但它強調的程度更強一些。
• <em>：將其中的文本表示為強調的內容，表現為斜體。
• <mark>：使用黃色突出顯示部分文本。
• <figure>：規定獨立的流內容（圖像、圖表、照片、代碼等等）（默認有40px左右margin）。
• <figcaption>：定義 figure 元素的標題，應該被置於 figure 元素的第一個或最后一個子元素的位置。
• <cite>：
  • 可以作為下面兩種引用標簽的屬性，指明來源的url
  • 也可以作為單獨的標簽使用，標明文檔中的對參考文獻的引用
• <blockquoto>：定義塊引用，塊引用擁有它們自己的空間。
• <q>：短的引述（跨瀏覽器問題，盡量避免使用）。
• <time>：
  • 其中的datetime屬性遵循特定格式，如果忽略此屬性，文本內容必須是合法的日期或者時間格式。
  • 在瀏覽器中不顯示
• <abbr>：簡稱或縮寫。
• <dfn>：定義術語元素，與定義必須緊挨着，可以在描述列表dl元素中使用。
• <address>：作者、相關人士或組織的聯系信息（電子郵件地址、指向聯系信息頁的鏈接）。
  • 瀏覽器默認呈傾斜字體
  • 當某個地址與文章作者無關，應該使用p而不是address
  • 不能包含和聯系信息無關的任何信息
• <del>：移除的內容。
• <ins>：添加的內容。
• <code>：標記代碼。
  • 一行時可以直接使用，多行時需要配合<pre>將其包裹，是瀏覽器識別大量縮進和空白字符。
  • <pre><code></code></pre>
• <var>：標記表示變量的名稱
• <meter>：定義已知范圍或分數值內的標量測量。（Internet Explorer 不支持 meter 標簽）
• <progress>：定義運行中的進度（進程）。

原文鏈接：https://blog.csdn.net/eeeecw/java/article/details/80591511