2014-09-19 60 views
0

這裏的樣本:如何引用另一個css風格?

.my-class { 
    font-size: 12px; 
} 

.my-another-class { 
    /* here I want to include .my-class style */ 
    .my-class; 
    border: 0; 
} 

我可以包括一個CSS類到另一個或沒有?

+0

goo ..... SCSS LESS SASS? http://stackoverflow.com/questions/11084757/sass-scss-nesting-and-multiple-classes – 2014-09-19 13:49:00

+1

不,你不能在純CSS中做到這一點。但是,您可以將多個類應用於任何元素。 – j08691 2014-09-19 13:49:10

+0

您可以設置多個選擇器,如: .my-another-class, .my-class {} – TheFrozenOne 2014-09-19 13:50:48

回答

3

您可以將多個目標定義爲.my-class規則,然後再指定規則只是.my-another-class

.my-class, 
.my-another-class { 
    font-size: 12px; 
} 

.my-another-class { 
    border: 0; 
} 

你甚至可以然後覆蓋某些特性,例如

.my-class, 
.my-another-class { 
    color: red; 
    font-size: 12px; 
} 

.my-another-class { 
    border: 0; 
    color: blue; /* overrides color: red; on .my-another-class */ 
} 
+0

哦,謝謝!這是我想要的。你能告訴我,這是一個很好的做法嗎? – omickron 2014-09-19 13:52:42

+0

這是完全可以接受的,每個人都會一直這樣做,我從來沒有聽說過沒有任何理由不這樣做。 SCSS或LESS是**更好的選擇,因爲它們給你更多的權力,但它們也更加複雜。對於vanilla CSS解決方案,這樣做沒有問題 – Joe 2014-09-19 13:53:44

+0

謝謝@Joe! – omickron 2014-09-19 13:58:07

0

你不能在普通的CSS中使用這樣的結構。

預處理器如LessSass支持此行爲與mixins

0

你不能,但你可以這樣做:

.my-class, .my-another-class{ 
    font-size: 12px; 
} 

.my-another-class { 
    border: 0; 
}