前面的話
用于標記段落里的文本和其他內容組的元素種類很多，本文將這些文本級元素進行簡單分類，便于整理和記憶
通用容器
<span>元素是短語內容的通用行內容器，并沒有任何特殊語義。可以使用它來編組元素以達到某種樣式意圖(通過使用類或者Id屬性)，或者這些元素有著共同的屬性，比如lang。應該在沒有其他合適的語義元素時才使用它。<span>與<div>元素很相似，但<div>是一個塊元素而<span>則是行內元素
<p>Some <span>text</span></p>
強調重要
雖然瀏覽器通常用斜體和粗體來顯示em和strong，但這些元素不應用作加粗和斜體。這兩個元素分別用來提升包含內容的強調程度和重要性
<em> 表示強調，<em>元素是可以嵌套的，嵌套層次越深，則其包含的內容被認定為越需要著重閱讀
<strong> 表示重要
<p>I am <em>very</em> worried!</p> <strong>warning</strong>
文字間隔
i和b元素歷來是用來展示粗體和斜體字體的，但在HTML5中，它們有了新的語義
<i>
[1]表示不同情緒或聲音的文本，如內心對白
<p>Simon smirked,"Yes,I'm happy to take the garbage out." <i>Ugh,I <em>really</em> don't want to !</i> he thought as he picked up the garbage bag.</p>
[2]表示外來語、分類學名和技術術語等
<i lang="fr">Oh la la!</i>
<b>
[1]用于分隔文字
<p>After bringing <b>water</b> to a boil, add <b>potatoes</b> and <b>carrots</b></p>
[2]用于文章或故事的引言
<p><b class="lede">Meteorologists predict more sunshine and scorching temperatures for the upcoming week, prompting area farmers to install irrigation systems.</b></p>
不精確文字
<s> 在HTML5中重新定義為有錯的、過時的、不被建議使用的文本，常用于表示價格變動等
<p>價格<s>￥1298</s>￥998！</p> <p><s>37度</s> <strong>41度</strong></p>
高亮顯示
<mark> 表示高亮或用于引用而標記的文字
<p><mark>We're all hoping it rains soon</mark>, some farmers have installed irrigation systems, at <em>considerable</em> expense</p>
次要評論
<small> 表示旁注，可用于免責聲明、使用條款和版權信息等需要小字體的場景
<small>圖片僅供參考，請以實物為準</small> <small>Chris Elhorn | The city Press</small>
術語處理
<dfn> 用來定義術語
<p>The term <dfn>organic food</dfn> refers to food produced without synthetic chemicals</p>
<abbr> 縮寫詞，可以配合<dfn>定義術語
<p>The <dfn><abbr title="Garage Door Operner">GDO</abbr></dfn> id a device allows off-world teams to open the iris.</p>
引用
<cite> 表示作品標題的引用，可以是書影音畫等
<p>我最喜歡的電影是<cite>千與千尋</cite></p>
<q> 表示短引用，常用于引用別人說的話，用引號可以表達等價語義
<p>The judge said <q>You can drink water form the fish tank</q> but advised against it.</p>
換行
<br> 換行
[注意]<br>標簽是文本級語義元素，可以設置行高和字體大小，但設置寬高無效
<p>
<b>The City Press</b><br />
123 General Street <br />
Springfield, OH 45501
</p>
<wbr> 需要時指定單詞可以換行的位置
<i>Irrigation<wbr /> Direct</i>
上標下標
這兩個標簽在數學等式、科學符號和化學公式中非常有用
<sup> 表示上標
<p> a<sup>2</sup> + b<sup>2</sup> = c<sup>2</sup> </p>
<sub> 表示下標
<p> H<sub>2</sub> SO<sub>4</sub> </p>
文本刪改
如果要表示文檔的增刪改記錄，則應該使用ins和del標簽
<ins> 文檔中插入的內容
<del> 文檔中刪除的內容
[注意]<ins>和<del>可以嵌套任何元素
<屬性>
[1]datetime:用于標明編輯的日期和可選的時間
[2]cite:用于指定說明編輯的文檔網址
<p>一打有 <del datetime="2015-12-30T00:00Z" cite="edit.html">二十</del> <ins>十二</ins> 件。</p>
特定時間
<time> 表示日期或時間
<屬性>
[1]datatime表示確切的時間，遵循格式YYYY-MM-DDThh:mm:ssTZD，表示年-月-天-分割符T-時-分-秒-時區
[2]pubdate表示<time>元素中的日期或時間是文檔的發布日期
<p>我們在每天早上 <time>9:00</time> 開始營業。</p> <p>我在<time datetime="2008-02-14">情人節</time>有個約會。</p> <small>Posted <time datetime="2015-12-30T00:00:00UTC+08:00"></time></small>
注音標識
ruby標簽定義注音標識，多用于CJK文字，CJK是指中日韓統一表意文字(Chinese、Japanese、Korean)
<ruby> 表示ruby標記
<rt> 表示ruby標記文字
<rp> 表示ruby標記括號
<ruby>
漢 <rt> ㄏㄢˋ </rt>
</ruby>
<ruby> 漢 <rp>(</rp> <rt>hàn</rt> <rp>)</rp> 語 <rp>(</rp> <rt>yǔ</rt> <rp>)</rp> </ruby>
文字方向
<bdi> 忽略周圍文字方向的文字
<bdo> 覆蓋兩種方向的設置，允許顯式設置方向，并覆蓋所有其他當前方向
<p>When rendered by a browser, <bdo dir="rtl">these words</bdo> will appear as 'sdroweseht'</p>
代碼
<code> 表示計算機代碼
<kbd> 定義鍵盤碼
<samp> 定義計算機例子代碼
<tt> 定義打字機代碼
<var> 定義變量
<p>
<code>Computer code</code>
<br />
<kbd>Keyboard input</kbd>
<br />
<tt>Teletype text</tt>
<br />
<samp>Sample text</samp>
<br />
<var>Computer variable</var>
<br />
</p>
例子演示
<演示框>點擊下列相應標簽名可進行演示
文章列表
留言列表
