CSS網(wǎng)頁布局經(jīng)驗(yàn)：富有語義地類class和id標(biāo)記命名

　　您應(yīng)該明白為什么我會(huì)說到這個(gè)，選擇合適的、有意義的元素去描述你的內(nèi)容，確保您所選擇的是富有語義的類class和id特征值。做正確的事情會(huì)使你的生活變得輕易很多，假如你是某個(gè)團(tuán)隊(duì)的一分子，對(duì)團(tuán)隊(duì)其他成員來說也是如此�？匆幌孪旅娴倪@條規(guī)則：


　　假如您是剛接手這個(gè)工作，您在CSS文件中看到了上面的內(nèi)容，您能不能說清楚這個(gè)類是什么意思？
大部分情況下您都會(huì)說不。這個(gè)類的名稱可能是個(gè)縮寫，但是恐怕沒有辦法去弄清楚他到底是什么的縮寫，眼前是一摸黑，或者是這種情況，可能是你把它放到這里，你現(xiàn)在很清楚它是什么意思，但是你能保證3年之后你還記得它是什么意思么？

　　現(xiàn)在我們看一下下面的規(guī)則：


　　你可能立即知道這個(gè)類選擇符是為左側(cè)邊欄的顯示藍(lán)色區(qū)塊而創(chuàng)建的，這時(shí)它就正確的表達(dá)了一定的語義。正如我在上面提到的，一旦要你在在一周內(nèi)要重新設(shè)計(jì)，但是在重構(gòu)過程中，這個(gè)區(qū)塊需要定位到右邊，顏色變?yōu)榧t色，類的特征值就沒有任何意義。所以你現(xiàn)在需要改變你所有的特征值，要不就什么都不改變，不過這樣可能或?qū)е轮刂氐睦Щ蟆?br/>
　　因此解決上面問題的最好方法就是在類特征值的命名中避免使用顏色(包括顏色名稱和十六進(jìn)制值)或者寬度、高度的尺寸值；同時(shí)你也盡量的避免去使用任何表明表現(xiàn)形式的值，例如box、left、right。反之，將表現(xiàn)和內(nèi)容分離的意義也就不復(fù)存在了。

　　最后，我們看一下最合適的命名規(guī)則：



　　您應(yīng)該能理解，這個(gè)規(guī)則是應(yīng)用于產(chǎn)品描述。無論您的設(shè)計(jì)改變了多少次都不會(huì)改變。清楚明了的感覺不錯(cuò)吧。：）