CSS教程：合理的減少標(biāo)簽的使用并適度的使用class與id_CSS教程

教程Tag：暫無Tag,歡迎添加,賺取U幣!

　　版權(quán)聲明：MB5U.com原創(chuàng)，未經(jīng)同意，謝絕轉(zhuǎn)載！

　　我們需要明白一點(diǎn)：HTML標(biāo)簽使用的越少越好。事實(shí)也證實(shí)了確實(shí)如此。我們想要?jiǎng)?chuàng)建具有良好結(jié)構(gòu)的文檔，那我們始終就需要考慮盡量少的使用標(biāo)簽。僅僅使用必須的標(biāo)簽，將其它可有可無的標(biāo)簽統(tǒng)統(tǒng)扔掉吧。我們僅僅保留了必要的標(biāo)簽，可以讓文檔保持較小的體積，從而提高了頁面的下載速度。從另一個(gè)方面來說，標(biāo)簽的減少也能夠讓瀏覽器以更快的速度進(jìn)行解析而顯示在屏幕上。當(dāng)然我們所說的是必要與不必要，假如必須需要某種容器來布局，那是不可以省略的。

　　我們看下面的例子：

示例代碼 [www.hl5o.cn]

這是多用了標(biāo)簽
<div>
<p>
　　這里是MB5U.com。歡迎您的到來！MB5U.com致力于Web標(biāo)準(zhǔn)在中國的應(yīng)用及發(fā)展！我們提供了許多文章及實(shí)例，您可以在這里學(xué)習(xí)到很多關(guān)于Web標(biāo)準(zhǔn)及CSS網(wǎng)頁布局的知識(shí)，希望這里的內(nèi)容對(duì)您的工作及學(xué)習(xí)有所幫助。我們期待著您與我們交流，歡迎多提寶貴意見。
</p>
</div>

示例代碼 [www.hl5o.cn]

這是減少了不必要的標(biāo)簽：
<p>
　　這里是MB5U.com。歡迎您的到來！MB5U.com致力于Web標(biāo)準(zhǔn)在中國的應(yīng)用及發(fā)展！我們提供了許多文章及實(shí)例，您可以在這里學(xué)習(xí)到很多關(guān)于Web標(biāo)準(zhǔn)及CSS網(wǎng)頁布局的知識(shí)，希望這里的內(nèi)容對(duì)您的工作及學(xué)習(xí)有所幫助。我們期待著您與我們交流，歡迎多提寶貴意見。
</p>

　　我們?yōu)樵靥砑舆m當(dāng)?shù)臉?biāo)識(shí)可以讓我們?cè)贑SS的編寫中更輕易控制他們，更能精確的為CSS樣式找到目標(biāo)。而且id還可以與javascript關(guān)聯(lián)起來，做出一定的效果與交互。我們都知道：id是獨(dú)一無二的，在同一個(gè)頁面上id只能出現(xiàn)一次。而class是一類可以重用的屬性，我們可以重復(fù)的應(yīng)用到頁面的多個(gè)元素上。

　　一個(gè)class可以應(yīng)用于多個(gè)元素，而一個(gè)元素同樣可以應(yīng)用多個(gè)class。我們也可以為一個(gè)賦予了id的元素應(yīng)用class。但我們必須要時(shí)刻提醒自己，id的唯一性，只能出現(xiàn)一次，只能為一個(gè)元素指定一個(gè)唯一的id。而class與id的命名，我們最輕易犯錯(cuò)的就是以數(shù)字開頭進(jìn)行命名，如1main、12text。這樣都是不正確的，正確的方法是：a-z、A-Z、0-9、“_”，但千萬別以數(shù)字開頭進(jìn)行命名。只能以字母開頭進(jìn)行命名。我們明白很多瀏覽器對(duì)這樣的命名大小寫并不敏感，但我們也要養(yǎng)成良好的編碼習(xí)慣，進(jìn)行習(xí)慣性的定義與統(tǒng)一。

　　我們看下面的例子：

示例代碼 [www.hl5o.cn]

<p class="12text"></p>
<div id="footer"><p id="footer"> </p></div>
上面兩個(gè)是錯(cuò)誤的例子。
<body class="homepage">
<p id="contact"></p>
<div id="main" class="main_a softcor solid_sider"> </div>
上面三個(gè)是正確的例子。

　　版權(quán)聲明：MB5U.com原創(chuàng)，未經(jīng)同意，謝絕轉(zhuǎn)載！
　　