Sass--僞類嵌套

其實僞類嵌套和屬性嵌套很是相似,只不過他須要藉助`&`符號一塊兒配合使用。spa

a {
    &:link,
    &:visited {
        color: blue;
    }
    &:hover {
        color: orange;
    }
    &:active {
        color: red
    }
}

編譯出來的 CSS:code

a:link, a:visited {
  color: blue;
}
a:hover {
  color: orange;
}
a:active {
  color: red;
}

避免選擇器嵌套:blog

  • 選擇器嵌套最大的問題是將使最終的代碼難以閱讀。開發者須要花費巨大精力計算不一樣縮進級別下的選擇器具體的表現效果。
  • 選擇器越具體則聲明語句越冗長,並且對最近選擇器的引用(&)也越頻繁。在某些時候,出現混淆選擇器路徑和探索下一級選擇器的錯誤率很高,這很是不值得。

爲了防止此類狀況,咱們應該儘量避免選擇器嵌套。然而,顯然只有少數狀況適應這一措施。開發

相關文章
相關標籤/搜索