HTML學習：圖片標簽
圖片標簽：
<!--
圖片標簽用于向當前頁面中引入一個外部圖片
使用img標簽引入外部圖片,img標簽是一個自結束標簽
img這種元素屬于替換元素(基于塊和行內元素之間,具有兩種元素的特點)
屬性:
src 屬性指定的是外部圖片的路徑( 路徑規則和超鏈接是一樣的)
alt 圖片的描述,這個描述默認情況下不會顯示,有些瀏覽器會圖片無法加載時顯示
搜索引擎會根據alt中的內容來識別圖片,如果不寫alt屬性則圖片不會被搜索引擎所檢測
width 圖片的寬度
height 圖片的高度
-寬度和高度如果只修改一個,則另一個會等比例縮放
注意:一般情況下在pc端,不建議修改圖片的大小,需要多大的圖片就裁剪多大
但是在移動端,經常需要對圖片進行縮放(大小縮放)
圖片的格式:
jped(jpg)
- 支持的顏色比較豐富,不支持透明效果,不支持動圖
-一般用來顯示照片
gif
- 支持的顏色比較少,支持簡單透明,支持動圖
-顏色單一的圖片,動圖
png
- 支持的顏色豐富,支持復雜透明,不支持動圖
-顏色豐富,復雜透明圖片(專為網頁而生)
webp
-這種格式是谷歌新推出的專門用來表示網頁中的圖片的一種格式
-它具備其他圖片格式的所有優點,而且文件還特別小
-缺點:兼容性不好
base64
-將圖片使用base64進行編碼,這樣可以將圖片轉換為字符,通過字符的形式來引入圖片
-一般都是一些需要和網頁一起加載的圖片才會使用base64
效果一樣,用小的
效果不一樣,用效果好的
-->
浙公網安備 33010602011771號