當瀏覽器要訪問一個帶有幾個<img>元素的網頁時,瀏覽器是啥也沒有,它先是從服務器獲取這個HTML文件,在窗口顯示出來,然后瀏覽器發(fā)現了這個文檔有幾個<img>元素,再從服務器把這幾張圖片去過來,顯示出來。
圖像的格式共有三種:JPEG,PNG,GIF
JPEG:不支持透明性,圖像有壓縮,圖像更小,像素有損,同時加載時更快
PNG:無損,支持透明性,所以被圖像覆蓋的區(qū)域的東西會被看到。
GIF:無損,支持透明性,支持animation
圖像在網頁的位置,就是<img>元素的位置。
src屬性:圖像URL地址。alt屬性:當圖像加載不出來,alt屬性的內容會出現原本圖像的位置??梢杂脕砀嬖V用戶圖像的內容。
你也可以用width和height屬性來指定圖像的大小。如果沒有指定大小,瀏覽器會在圖像顯示出來之前,自動決定圖像的大小。
因為瀏覽器是先把整張圖片的數據從服務器獲取過來,再根據情況調整圖像的大小的,很多圖像原始占的空間是很大的,所以最好先把圖像剪裁成合適大小,再把圖像用在網頁上。而節(jié)省瀏覽器加載的時間。
一般情況,用戶瀏覽器窗口大小在800-1200px間,圖像的寬度要小于800px,logo的寬度在100-200px之間。