inline css

我在HTML Email設計教戰守則這篇短文裡曾提到:製作電子報、EDM等HTML格式的Email時,一定要使用Inline CSS。

所謂Inline CSS,也就是把CSS的統一宣告各別寫入網頁元件裡。譬如像以下這個例子:

jasfont

<style>
.jasfont{color:#f50;font-size:20px;font-family:arial black;}
</style>
<p class="jasfont">jasfont</p>

改寫成

<p style="color:#f50;font-size:20px;font-family:arial black;">jasfont</p>

即為Inline CSS。

在HTML Email設計上使用Inline CSS,當然是確保設計不會因收信軟體而失真的必要之惡,但設計程序因此變得較為繁瑣,畢竟是不爭的事實。尤有甚者,有時當你以CSS架構完整個網站之後,客戶才要求依照相同樣式設計一份電子報或EDM,明明事先知會就可以畢其功於一役的設計案,等於多浪費一件小案子的資源來做,算起來應該也是賠本生意。

不過,這種情況即將因為好用工具的面世而改變。透過這個Inline CSS轉換器,Designer可以很便利地把CSS架構的網頁原始碼轉換成Inline CSS,這也就是說:以往必須耗費許多無謂時間精力去改寫的Inline CSS,現在只要直接用現成的CSS頁面去轉,不到幾秒鐘,電子報或EDM就自動完成了。

延伸閱讀:10項以RSS取代Email的好理由

technorati tag

1 留言

LVCHEN寫道…
我還沒去用...但我想,Anchor Pseudo-classes(如a:hover) 應該是無法轉換的吧,除非用 Javascript。
不過這東西應該還是有其方便之處的啦。
較新的 較舊