2012-03-29 44 views
2

我將圖像插入一個div容器CSS是這樣的:使用插入圖像與類:前

.ft-folder-closed:before { 
    content: url('../ll-filetree/img/ft-plus.16.png'); 
} 

我想申請一些CSS屬性的形象,而不列出他們在連同「內容「屬性,但對其應用了更高級的樣式,以減少CSS開銷。像這樣的事情,但是這當然不起作用:

.ft-folder-closed:before { 
    content: url('../ll-filetree/img/ft-plus.16.png'); 
    inherit: ft-floder-icon; 
} 

任何機會,以做到這一點?

+0

你能發送圖像鏈接嗎 – 2012-03-29 12:35:46

+2

我知道這樣做的唯一方法是使用像LESS或SASS這樣的CSS預處理器。 – hradac 2012-03-29 12:36:55

回答

0

您可以將CSS選擇器分組以在多個元素上應用相同的樣式。這使您可以將相同的樣式應用於多個元素,而無需重複樣式。

實施例:

.ft-folder-icon, .ft-folder-closed:before { 
    color: red; 
} 

這將適用的顏色:紅;樣式到.ft-folder-icon元素和.ft-folder-closed:在僞元素之前。

如果你決定使用一個CSS預處理器一樣LESS你可以抽象使用「混入」你的CSS與此類似:

.ft-folder-closed:before{ 
    .ft-folder-icon; 
} 

使用「混入」你可以嵌入所有類的屬性只需將類名作爲其屬性之一包含到另一個類中即可。它與變量非常相似,但是對於整個類。