CSS類可以繼承自其他的類,以便實現代碼復用,提高效率。下面是繼承CSS類的使用方法。
/* 定義一個基本樣式 */ .base { color: red; font-size: 16px; } /* 繼承基本樣式 */ .child { composes: base; font-weight: bold; }
上面的代碼中,先定義了一個基本樣式類 `base`,包含了文字顏色和字號。接著,又定義了一個子樣式類 `child`,指定了繼承基本樣式類 `base`,并加上了粗體字樣式屬性。
/* 繼承多個樣式 */ .son { composes: base1 base2 base3; /* other styles */ }
繼承多個樣式時,可以通過空格將需要繼承的類名分隔開來:
/* 繼承偽類 */ .pseudo { &:hover { color: #00ff00; } }
對于偽類樣式,也可以像上面的代碼一樣,使用 `&` 符號來表示當前選擇器,實現偽類繼承。
通過繼承CSS類,我們可以快捷地實現基本樣式的復用,減少代碼量,提高代碼的可維護性和可讀性。
上一篇CSS箱變是什么意思
下一篇css類名規范寫法