SCSS !optional

admin發表於2018-10-29
CSS

optional翻譯成漢語具有"可選的"的意思。

顧名思義，!optional標記前面的擴充套件不必須生成一個新的選擇器。

看一段SCSS程式碼片段：

[Scss] 純文字檢視 複製程式碼
p{
   color:red;
   @extend .notice 
 }

由於並不存在一個名為notice的樣式類，所以上述程式碼會報錯。

關於@extend用法可以參閱SCSS @extend一章節。

程式碼修改如下：

[Scss] 純文字檢視 複製程式碼
p{
  color:red;
  @extend .notice !optional
}

由於是可選的，即便notice樣式類不存在也不會報錯。

編譯結果如下：

[CSS] 純文字檢視 複製程式碼
p {
  color: red;
}

相關文章