6-2. 繼承的高級(jí)用法

任何css規(guī)則都可以繼承其他規(guī)則，幾乎任何css規(guī)則也都可以被繼承。大多數(shù)情況你可能只想對(duì)類使用繼承，但是有些場(chǎng)合你可能想做得更多。最常用的一種高級(jí)用法是繼承一個(gè)html元素的樣式。盡管默認(rèn)的瀏覽器樣式不會(huì)被繼承，因?yàn)樗鼈儾粚儆跇邮奖碇械臉邮?，但是你?duì)html元素添加的所有樣式都會(huì)被繼承。

接下來(lái)的這段代碼定義了一個(gè)名為disabled的類，樣式修飾使它看上去像一個(gè)灰掉的超鏈接。通過(guò)繼承a這一超鏈接元素來(lái)實(shí)現(xiàn):

.disabled {
  color: gray;
  @extend a;
}

假如一條樣式規(guī)則繼承了一個(gè)復(fù)雜的選擇器，那么它只會(huì)繼承這個(gè)復(fù)雜選擇器命中的元素所應(yīng)用的樣式。舉例來(lái)說(shuō)， 如果.seriousError@extend.important.error ， 那么.important.error 和h1.important.error 的樣式都會(huì)被.seriousError繼承， 但是.important或者.error下的樣式則不會(huì)被繼承。這種情況下你很可能希望.seriousError能夠分別繼承.important或者.error下的樣式。

如果一個(gè)選擇器序列(#main .seriousError)@extend另一個(gè)選擇器(.error)，那么只有完全命中#main .seriousError這個(gè)選擇器的元素才會(huì)繼承.error的樣式，就像單個(gè)類名繼承那樣。擁有class="seriousError"的.main元素之外的元素不會(huì)受到影響。

像#main .error這種選擇器序列是不能被繼承的。這是因?yàn)閺?code>#main .error中繼承的樣式一般情況下會(huì)跟直接從.error中繼承的樣式基本一致，細(xì)微的區(qū)別往往使人迷惑。

現(xiàn)在你已經(jīng)了解了通過(guò)繼承能夠做些什么事情，接下來(lái)我們將學(xué)習(xí)繼承的工作細(xì)節(jié)，在生成對(duì)應(yīng)css的時(shí)候，sass具體干了些什么事情。