[css] initial/inherit/unset 有什麼差別呢?

常寫 CSS 應該都經常遇到樣式被覆蓋後不如預期希望回復為初始值等等的問題 常見的場景可能是使用 bootstrap, semantic 等等的 css framework 時,可能是 display, color 等等的屬性值被繼承或更改,希望回復為預設值或繼承至 parent. 另外在專門做網頁第三方元件,像是 disqus 這種必須放在百百種網頁上的元件,在技術規劃初期就將所有 CSS 做上 all: initial 更是不可或缺的事情! 以下就讓我們看看 initial/inhreit/unset 三者的差別吧 ~ initial將此屬性值恢復為瀏覽器預設值.備註:所有 browser 都有自己的一套預設樣式,就像 input 在各 browser 都長不一樣是相同的道理 inherit繼承 parent 的設定值 unset如果 parent 有設定此屬性值則 inherit ,反之則 initial 讓我們來個簡單的例子,相信你也可以很簡單弄懂他們的差別 XD 首先有個 HTML: 然後對應的 CSS: 結果: 在 Chrome 上看的結果 因為 inherit 是繼承,所以會套用到 […]

Continue reading