Inline CSS

除了HTML Email(即edm或電子報)之外,一般而言,Inline CSS最常見的用法就是:在段落間用來覆寫(或推翻)既定CSS的定義。

尤其對已經運行了一段時間的網站來說,任何一個CSS Selector都可能套用在多個頁面,如果貿然去更動,結果可能就是牽一髮而動全身式的殘局收拾不完。

通常,在防範最慘烈下場的全盤考量下,designer會選擇使用inline css來給新頁面的某些網頁元件樣式以客製合用的定義。

譬如像以下這樣:

<div style="background: black;color: white">
這是一個黑底色反白字的DIV頁面區塊
</div>

這樣的作法,當作個案特例的解法,偶一為之應該還好。

不過,如果不知不覺地連用好幾次,或許也會有:某天想到要全盤改動時,必須逐頁逐頁去改的麻煩。

這時候,就需要用到一種覆寫Inline CSS覆寫功能的技法了。

實際作法就像這樣:

/* 覆寫掉所有使用Inline CSS的DIV頁面區塊 */
div[style] {
background: white !important;
color: black !important;
}

3 留言

匿名表示…
hello... hapi blogging... have a nice day! just visiting here....
花蓮民宿寫道…
需要用到一種覆寫Inline CSS覆寫功能的技法
較新的 較舊