2.2 語義化

2018-11-10 12:54 更新

語義化

沒有 CSS 的 HTML 是一個語義系統(tǒng)而不是 UI 系統(tǒng)。

通常情況下,每個標簽都是有語義的,所謂語義就是你的衣服分為外套, 褲子,裙子,內褲等,各自有對應的功能和含義。所以你總不能把內褲套在脖子上吧。-- 一絲

此外語義化的 HTML 結構,有助于機器(搜索引擎)理解,另一方面多人協(xié)作時,能迅速了解開發(fā)者意圖。

常見標簽語義

標簽 語義
<p> 段落
<h1> <h2> <h3> ... 標題
<ul> 無序列表
<ol> 有序列表
<blockquote> 大段引用
<cite> 一般引用
<b> 為樣式加粗而加粗
<strong> 為強調內容而加粗
<i> 為樣式傾斜而傾斜
<em> 為強調內容而傾斜
code 代碼標識
abbr 縮寫

示例

將你構建的頁面當作一本書,將標簽的語義對應的其功能和含義;

  • 書的名稱:<h1>
  • 書的每個章節(jié)標題: <h2>
  • 章節(jié)內的文章標題: <h3>
  • 小標題/副標題: <h4> <h5> <h6>
  • 章節(jié)的段落: <p>

更多語義化的內容,參考 sofish 寫的文章 這樣去寫你的 HTML。

以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號