DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> CSS入門知識 >> CSS詳解 >> CSS: 關於如何選擇同一容器內部分標簽的想法
CSS: 關於如何選擇同一容器內部分標簽的想法
編輯:CSS詳解     

首先來看一段代碼:
<br />
#wrap p {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap span {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap ul {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap font {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />
#wrap .swd {<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />

很容易看出, 這段代碼中我們對多個不同的標簽進行了相同的屬性定義. 所以在一般情況下, 我們會這樣來整合代碼:


<br />
#wrap p, #wrap span, #wrap ul, #wrap font, #wrap .swd {<br />
    font-size: 14px;<br />
    color: red;<br />
}

在這段代碼中, 我們將放置在 #wrap 容器裡的一些標簽同時進行了定義 [包括字體大小和顏色] . 與前面的相比, 節省了很多代碼.

但事實上, 我們還是沒有做到最大限度的壓縮代碼. 因為在上面的這段代碼中, 我們所定義的對象都是被放置在 #wrap 容器中的. 所以, 我們能不能用某種辦法來聲明, 我們所定義的對象對是處於 #wrap 內呢?

來看看這個, 銳風的想象版1:


<br />
 #wrap {<br />
    p, span, ul, font, .swd {<br />
        font-size: 14px;<br />
        color: red;<br />
    }<br />
}<br />

這個版本應該還是很容易理解的.

再來看看銳風的想象版2:


<br />
#wrap(p, span, ul, font, .swd){<br />
    font-size: 14px;<br />
    color: red;<br />
}<br />

這個和前面的相比, 對於普通的讀者來說可能稍稍有些難理解. 但是學過 PHP 的朋友都應該很熟悉吧? 是的, 這個完全參考了 PHP 的語法. 所以從理論上講, 這個版本對腳本解釋器應該會更友好一些.

上面我提到的這兩種辦法, 可能並不是完全可行. 但在一些時候, 或許我們確實應該多一點挑剔. 你說呢?

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved