相信有寫過 CSS 的朋友都知道 CSS 的優先性: inline-style > id > class。
selector 越明確的話優先度越高,如 p.text > p
但是,如果有用過 CSS 框架(bootstrap、angular-material)的,可能就會發現有些 CSS 被設置了 !important。由於會增加後續維護困難,在平常可能比較少見。
因此我們來看一個
標籤若被設置 style、class、id 與 !important 各種不同顏色。
試著移除CSS後,可以發現優先序為:!important > inline style > id > class
由此可知,!important 會優先於其他的 selector 設定的 CSS。
因此使用大量的 !important 將會導致覆寫複雜及除錯困難,可以的話盡量少用。