CSS中,background可以設置對象的背景樣式。如顏色或者使用一張圖片代替,今天我要多說兩句的就是使用一張圖片的參數:image。准確的來說應該是background-image。我們可以這樣用它:
body{
background-image: url(... .jpg);
}
/* 也可以直接使用background 代替 */
body{
background: url("....jpg");
}
css顯示圖片分3種,第一種是單純的顯示一個圖片;第二種稱之為CSS Sprites,也就是說把若干小圖片合成一個大圖片,然后通過background的postion參數實現效果,第三種是Inline images。這個方法不適用於IE瀏覽器。
CSS Sprites是一種把所有的圖片都以base64編碼以源代碼的形式寫在CSS文件里,格式是這樣的:data:[<mediatype>][;base64],<data>
data:URL標簽是在1995年第一次提出,按RFC2397規范的描述:它是"allows inclusion of small data items as 'immediate' data.(允許在頁面中包含一些小的即時數據)"。如一個內嵌的的圖片可以這樣引用:
{ background-image:url(data:image/gif;base64,R0lGODlhCAAIAJEAAOnp6eTk5O7m8AAAACH5BAEAAAIALAAAAAAIAAgAAAINjAMJh2q6DnxOVsqmLQA7); }
這段代碼可以在firefox瀏覽器運行。這行代碼的意思是,gif格式的以base64編碼成最后的字符串的圖片應用為背景。樣式應用的結果是一種斜條紋狀的背景。