如何在css中使用另一個規則中的規則？

我想問的是有點奇怪，我想，但我沒有別的辦法。
有沒有辦法做到在現實生活中這種僞CSS規則：
讓我們說我有規則：如何在css中使用另一個規則中的規則？

.myCssRule1{ color:red; }

我不能（不願）去改變它，但我需要使用它在另一個規則，我會這樣做：

.myCssRule2{ 
    .myCssRule1 
}

就像從另一個裏面調用方法。
任何本地方式或JS庫來做到這一點？

來源

2013-02-14 Dabbas

不可能。除了'@ media'指令之外，CSS規則不能嵌套。 – 2013-02-14 17:29:58

您可以使用像LESS這樣的CSS框架來執行此操作。

您使用LESS編寫的代碼會被編譯爲「原生」css文件。

這個範例：退房Mixins：http://lesscss.org/

下面的代碼直接從較少的鏈接

// LESS 

.rounded-corners (@radius: 5px) { 
    -webkit-border-radius: @radius; 
    -moz-border-radius: @radius; 
    -ms-border-radius: @radius; 
    -o-border-radius: @radius; 
    border-radius: @radius; 
} 

#header { 
    .rounded-corners; 
} 
#footer { 
    .rounded-corners(10px); 
}

使用採取少，這是編譯：

/* Compiled CSS */ 

#header { 
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    -ms-border-radius: 5px; 
    -o-border-radius: 5px; 
    border-radius: 5px; 
} 
#footer { 
    -webkit-border-radius: 10px; 
    -moz-border-radius: 10px; 
    -ms-border-radius: 10px; 
    -o-border-radius: 10px; 
    border-radius: 10px; 
}

來源

2013-02-14 17:29:46 cowls

我是LESS的初學者，所以我有問題PLZ：我創建了一個名爲'style.less'的文件，併爲less.js和'link'標籤添加了'script'標籤，用於我的新'style.less'，這就是它。爲什麼這不適合我？我還需要做更多的事嗎？ – Dabbas 2013-02-14 18:55:37

@Dabbas：你還記得在鏈接標籤中加入'rel =「stylesheet/less」'嗎？ – Hubro 2013-02-14 20:54:05

您將需要一個CSS預處理器來做到這一點。最受歡迎的是Sass和LESS。

薩斯（http://sass-lang.com/）
LESS（http://www.lesscss.org/）

來源

2013-02-14 17:30:32 cimmanon

不能樣式使用純CSS這樣混入選擇。我建議你取得結果的方式是創建一個類你想要共享的屬性，例如：

.red { 
    color: red; 
}

，並且該類適用於所有你想要的是紅色的元素。任何HTML元素都可以擁有類的任何金額：

<div class="myCssRule1 myCssRule2"></div>

一個更好方式（在我看來）是使用一個CSS預處理器，這是給你一個語言常有類似的CSS額外的功能，但編譯到一個正常的CSS樣式表。我最喜歡的一個是Stylus，但你也應該看看LESS,Sass和Compass。

來源

2013-02-14 17:39:42 Hubro

如何在css中使用另一個規則中的規則？

回答

相關問題