如何正確顯示部落格觀察的經典名次貼紙的LOOK圖案？

其實更廣泛來講，這篇文章要解決的問題是：如何為具備透明屬性的圖片加上底色，以避免圖片的透明部分跟網頁底色混在一起而導致整張圖片看得不夠清楚。

講起來實在有點饒舌，咱們眼見為憑，看張圖解就知道我的意思了：



上圖將部落格觀察的「經典貼紙」與「等級與比例」貼紙並列顯示，位在下方的「等級與比例」貼紙便因為網頁的深藍底色而導致LOOK字樣圖案變得不清晰，相反地，位在上方的「經典貼紙」則因為已經過調整而顯得十分明瞭。

針對這個問題，很直覺的想法就是只要讓圖片在顯示的時候能夠搭配適當的底色即可（例如白色）。非常酷的是，HTML的img標籤居然也有支援CSS的背景顏色設定，所以只要在img標籤裡面加入如下的屬性即可達成此目的：

style="background-color: white;"

【2009.06.18 updated】

FeedBurner的RSS Feed訂閱人次標籤也有同樣的透明背景色問題，有圖有真相：



上方是使用白色底色的結果，如此方能夠清楚地看到那行「BY FEEDBURNER」文字。