在 CSS 中找到基數類名可能是一個相對陌生的概念。在 CSS 中,我們通常會使用類名來指定樣式。然而,在某些情況下,我們需要使用“基數類名”來處理樣式。什么是基數類名?基數類名是指一個 CSS 類名集合中的第一個類名。下面我們將展示如何找到基數類名。
.example { color: red; } .example--modifier { color: blue; } .example--modifier-another { color: green; }
在這個例子中,我們有三個類名,其中 "example" 是基數類名。要找到基數類名,我們需要注意兩個要素:第一,基數類名是指類名集合中的第一個類名;第二,使用基數類名來僅僅指定基礎樣式,使得 CSS 更便于維護和可預測。
另一個有用的技巧是使用 BEM Methodology,它可以讓我們更容易的使用基數類名來指定基礎樣式,并使用修改器類名來指定其他變化、狀態的樣式。BEM Methodology 的規則如下:
- 塊:Block
- 元素:Element
- 修改器:Modifier
使用 BEM Methodology 的話,以上例子的代碼應該是這樣的:
.block { color: red; } .block__element { color: blue; } .block__element--modifier { color: green; }
在這個例子中,基數類名使用 "block" 來指定基礎樣式,而 ".block__element" 和 ".block__element--modifier" 用來指定其他變化、狀態的樣式。
總結來說,找到基數類名需要注意兩個要素:基數類名是指類名集合中的第一個類名;使用基數類名來僅僅指定基礎樣式。同時,使用 BEM Methodology 可以幫助我們更容易的使用基數類名來指定基礎樣式,并使用修改器類名來指定其他變化、狀態的樣式。
上一篇css樣式中的隱藏