search
[HTML]小圖示使用Data URI Scheme提高網頁效能

[HTML]小圖示使用Data URI Scheme提高網頁效能

如果弄個社群的平台,一定會使用到很多種小圖示,但在開啟網頁時,http request的數量是很驚人的,為了提高網頁的開啟速度,可以使用Data URI Scheme的方式來存取圖片。

Data URI Scheme就是將圖片使用base64編碼轉換成字串,再將字串直接嵌在CSS或HTML中(至於base64 encode網路上有許多現成網站)

使用方法
HTML:

test

CSS:

/* 注意:base64字串不能斷行 */
background:url(data:image/png;base64,base64的字串);

不過這只能適用於小圖示,若把其他一般圖片也用Data URI Scheme嵌到網頁上的到,會造成CSS檔或HTML檔過於肥大

Categories: WebDesign

Search
搜尋:
熱門推薦

本文由 佛祖球球 提供 原文連結

佛祖球球
寫了850篇文章,獲得25次喜歡
留言回覆
回覆
精彩推薦