1. 程式人生 > >html5基礎第三篇,圖片標籤。

html5基礎第三篇,圖片標籤。

1.img顯示圖片的標籤

<img  src="" alt="" width="" height="">

2.必選屬性

(1).src。圖片顯示內容的路徑

絕對路徑 :帶有網路協議的網址

<img src="https://www.baidu.com/img/bd_logo1.png">

相對路徑:從原始檔到目標檔案的過程 

 原始檔與目標檔案在同一資料夾:

<img src="12.jpg">

目標檔案存在資料夾中

<img src="img/11.jpg">

 原始檔有資料夾

<img src="../14.jpg">

原始檔,目標檔案都有資料夾

<img src="../img/11.jpg">

根相對路徑: 從碟符開始,到目標檔案的過程,本地執行,有的瀏覽器支援,有的瀏覽器不支援.但是如果是通過伺服器執行html檔案,根相對路徑,一定不支援,圖片一定無法顯示

<img src="C:\\Users\yufan\Desktop\d.png">

 因為伺服器不支援 \   web不使用根相對路徑

(2)alt.

alt是圖片顯示失敗時的替換顯示內容 ,一般寫圖片型別或者內容說明或者寫圖片路徑說明 寫:圖片正在載入...alt圖片載入成功時,不會顯示alt屬性並不會影響圖片的顯示,但是作為img標籤完整的設定內容,必須要有.

(3)圖片的大小.圖片的大小由圖片屬性寬,高來決定.如果指定圖片寬高屬性中的一個,瀏覽器會根據圖片原始大小比例,對另一個屬性自動調整.圖片的寬高,使用CSS樣式設定.