合併CSS類定義

Question

我定義字體對自己是這樣的：

.smallboldblue{font-family:Trebuchet MS;font-weight:bold;font-size:11px;color:#3A63A5;} 
.medregblue{font-family:Trebuchet MS;font-size:13px;color:#3A63A5;} 
.medboldblue{font-family:Trebuchet MS;font-weight:bold;font-size:13px;color:#3A63A5;} 

我也定義是反覆這樣的菜單選項或章節的標題是這樣elemets：

.MenuOptions{float:right;margin-right:0px;} 
.SectionOption{float:left;margin:10px 0px 0px 50px;} 

所以，當我創建divs，我經常發現自己寫這個：

<div class="MenuOptions medboldblue"> 

我知道我可以合併這兩個類，但我喜歡有我的fo nts在一個班級和另一個班級處理定位等。

是否有一種方法在CSS中使所有MenuOptions爲字體medboldblue，以便如果我想將字體從medboldblue更改爲largeboldblue，我可以在不通過每個MenuOptions div的情況下更改該字體嗎？我知道我可以很容易地用jQuery和addClass做到這一點，但我想知道是否有辦法用純CSS來做到這一點。

謝謝。

Answer 1

不，你不能用純CSS做到這一點。可以使用SASS或LESS CSS。

或者您可以將樣式從medboldblue添加到MenuOptions。

但是，如果您想了解組織CSS的最佳方式，我真的會推薦閱讀關於OOCSS的文章。

Answer 2

除非我誤解你的問題，你可以很容易地用CSS來做到這一點。

您在第一節中定義的所有屬性都是繼承的（font,color），所以您只需將樣式應用於父/菜單元素，樣式將由所有菜單選項繼承。

當你決定改變字體類時，你只需要改變它的菜單。