在另一個類中調用一個CSS類？

是否有可能有一個CSS類參考？而不是重新編寫所有的CSS代碼？在另一個類中調用一個CSS類？

例如，我有這樣的：

.btn{ 
    /* Whatever btn related styles I have */ 
} 

.btn:hover{ 
    box-shadow:0 0 4px black; 
} 

.btn:active{ 
    /* This is where I want to reference the '.red' class */ 
} 

.red{ 
    /* There is a LOT of CSS code here for cross browser gradients */ 
}

的事情是，我已經使用.red類作爲是在某些地方，我也希望同樣的漸變樣式應用到所有與.btn類元素的'活躍'狀態...

如果你可以幫助解決（它不需要我所要求的方式），我將不勝感激...

來源

2011-06-13 Abhishek

你實際上不能做一個引用（CSS的主要缺陷之一），但你可以這樣做：

.btn:active, .red { 
    /* Block A: Most (or all) of what used to just be in .red below */ 
} 

.btn:active { 
    /* Block B: Stuff *just* for .btn:active, if any */ 
} 

.red { 
    /* Block C: Stuff *just* for .red, if any */ 
}

逗號表示，在方框A的主體中的定義分別應用於那些選擇器中的每個，因此它們適用於任何「.btn」元素是‘：活動的’，並分別適用到任何「.red」元素。

塊B和塊C是可選的。它們適用於您只想應用於給定選擇器的任何定義。您通常在之後列出這些，因爲等同特異性的規則從上到下應用，因此您可以覆蓋要在塊B或塊C中的塊A的任何內容，並且這些塊將「獲勝」。

來源

2011-06-13 06:19:53

嗯......我理解這個概念，你將共同的屬性分享給.btn：active和.red類......但是你看，內容完全一樣。也許我只是用你的第一個聲明？這樣我只定義一次屬性，但它們同時適用於.btn：active和.red類。 – Abhishek 2011-06-13 06:34:36

@ Abhishek：是的，就是這樣。如果一切都應該完全一樣，你只需定義第一條規則，而不是其他兩條。另外兩個就是如果您需要定義一些僅限於「.btn：active」或「.red」而不是其他屬性的其他屬性。他們分享的一切都在第一條規則中。如果他們共享一切，那麼這是* only *規則。 – 2011-06-13 06:39:26

K隊友，感謝相當超級的協助...... :-) – Abhishek 2011-06-13 06:51:49

在另一個類中調用一個CSS類？

回答

相關問題