HTML5文本 描述性信息 修飾

■知識(shí)點(diǎn)

    span是沒有任何語義的行內(nèi)元素，適合包裹短語、流動(dòng)對(duì)象等內(nèi)容，而div適合包含塊級(jí)內(nèi)容。如果希望為行內(nèi)對(duì)象應(yīng)用下面項(xiàng)目，則可以考慮使用span元素。

    HTML5屬性，如 class、dir、id、lang、title 等。

    CSS 樣式。

    JavaScript 腳本。

■實(shí)例設(shè)計(jì)

下面的示例使用span元素為行內(nèi)文本“HTML”應(yīng)用CSS樣式，設(shè)計(jì)其顯示為紅色。

    <style type="text/css">

    .red { color: red; }

    </style>

    <p><span class="red">HTML</span>是通向 Web 技術(shù)世界的鑰匙。</p>

    在上面示例中，想對(duì)一小塊文字指定不同的顏色，但從句子的上下文看，沒有一個(gè)語義上適合的HTML元素，因此額外添加了span元素，定義一個(gè)類樣式。

■小結(jié)

    span沒有語義，也沒有默認(rèn)格式，用戶可以使用CSS添加類樣式?？梢詫?duì)一個(gè)span元素同時(shí)添加class和id屬性，兩者區(qū)別：class用于一組元素，而id用于頁面中單獨(dú)的、唯一的元素。在HTML5中，沒有提供合適的語義化元素時(shí)，微格式經(jīng)常使用span為內(nèi)容添加語義化類名，以填補(bǔ)語義上的空白。