初衷：
本篇是看過極客時間裡winter老師的文章《04 | HTML語義：如何運用語義類標籤來呈現Wiki網頁？》寫的。 由於葉葉從事的工作原因，單純寫靜態頁面並非自己常態化工作，更多的是實現其中業務邏輯，於是便忽略了HTML的學習，直到看到這篇文章後，才意識到自己懂得真心少。
內容：
1.什麼是HTML語義化？
簡單理解就是:用恰當的HTML標籤、class類名，讓機器和人快速理解網頁內容。
2.HTML語義化的好處？
- 益於開發和維護；
- 增加可閱讀性，使頁面更加結構化；
- 利於SEO搜尋引擎檢索……
3.常見的HTML語義化標籤有哪些？
body, article, nav, aside, section, header, footer, hgroup,h1-h6、address等
4.劃重點：
group: 標籤用於對網頁或區段（section）的標題進行組合(標題組);例：
<hgroup>
<h1>Welcome to my WWF</h1>
<h2>For a living planet</h2>
</hgroup>
<p>The rest of the content...</p>
複製程式碼abbr:標籤指示簡稱或縮寫，比如 "WWW" 或 "NATO"。 通過對縮寫進行標記，您能夠為瀏覽器、拼寫檢查和搜尋引擎提供有用的資訊。 此標籤最初是在 HTML 4.0 中引入的，表示它所包含的文字是一個更長的單詞或短語的縮寫形式。
小技巧：可以在 標籤中使用全域性的 title 屬性，這樣就能夠在滑鼠指標移動到 元素上時顯示出簡稱/縮寫的完整版本。例：
The <abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
複製程式碼hr與 VS 下邊框?
hr:標籤在 HTML 頁面中建立一條水平線。
水平分隔線（horizontal rule）可以在視覺上將文件分隔成各個部分。 但是閱讀文章後，才意識到原來hr標籤也表示故事走向的轉變或者話題的轉變。於是在選擇hr或者使用border 的CSS時，也就有所區分了。例：
<h1>This is header 1</h1>
<hr />
<p>This is some text</p>
複製程式碼關於blockquote, q, cite 引用標籤的使用？？？
不得不承認，葉葉居然是第一次看見這三個標籤。真感覺瑟瑟發抖……仔細看了一下MDN以及各種文件，最後還是不太清楚， 它是怎麼實現滑鼠點選上去，彈出右上角的提示框，類似於a標籤的title屬性。 如果有清楚的同學，麻煩告訴葉葉一聲，不勝感謝！ 至於它的使用，等葉葉熟悉了，再來補充。
5.附上一張圖：
6.傳送門
結語：
在實際生產中，我們需要用對的語義標籤，用好語義標籤，萬一不懂、不會的，不用也是最佳的方案。最後，葉葉還是保持一顆“空杯心態”繼續學習。