img顯示本地圖片使用的是相對路徑 如：

 img src= ./imgs/002.jpg 

開發(fā)技巧：在實際開發(fā)中，一般會在項目目錄下創(chuàng)建一個imgs文件夾，將圖片資源都放在里面，方便開發(fā)時圖片調(diào)用。如上面顯示的那樣，./imgs是找到圖片的所在目錄，/002.jpg是所要選擇的圖片。

img顯示網(wǎng)頁圖片使用的是絕對路徑 如：

 img src= /uploads/allimg/190430/141F45E3-1.png / 

img下有許多屬性可以選擇：

1、alt 表示圖片加載錯誤時的顯示內(nèi)容，方便訪問者知道該圖片的用途。

如：

 img src= ./imgs/001.jpg12 alt= logo 

顯示結(jié)果是：

表示這張圖片是一張logo圖。

2、align 表示圖片在文字中對齊的位置

top頂部對齊，bottom底部對齊，middle居中對齊。默認(rèn)為底部對齊。

兩個懸浮效果 left圖片浮動到文字左側(cè)，right圖片浮動到文字右側(cè)。

3、通過width和height改變圖片的大小

2和3的代碼演示如下

 p 一張百度logo img src= ./imgs/001.jpg width= 100 / /p  p 一張百度logo img src= ./imgs/001.jpg align= top width= 100 / /p  p 一張logo img src= ./imgs/002.jpg align= bottom width= 100 /p  p 百度logo img src= ./imgs/002.jpg align= middle width= 100 /p  p 百度logo img src= ./imgs/002.jpg align= left width= 100 /p  p 百度logo img src= ./imgs/002.jpg align= right width= 100 /p 

其中圖片都是相對路徑下的本地圖片

4、點(diǎn)擊圖片，打開另一個鏈接

 p 點(diǎn)擊圖片打開鏈接 a href= page1.html title= 點(diǎn)擊進(jìn)入page1界面 img src= ./imgs/001.jpg alt= logo width= 200px align= middle / /a /p 

其中 page1.html為另外一個html文檔，代碼如下：

 html  head  title page1界面 /title  /head  body  p 我是page1 /p  /body  /html 

點(diǎn)擊圖片就會打開page1.html。

5、圖像映射

 img src= page.jpg border= 0 usemap= #page alt= pages /  map name= page id= page  area shape= circle coords= 180,139,14 href = page1.html alt= page1 /  area shape= circle coords= 129,161,10 href = page2.html alt= page2 /  /map 

其中area與map合用，且area在map標(biāo)簽下。img的usemap指向map的name。實現(xiàn)點(diǎn)擊圖片不同位置，進(jìn)入page1或page2兩個不同的鏈接。

以上就是 html img標(biāo)簽的使用 的所有內(nèi)容了，希望會給大家?guī)韼椭伞?/p>

相關(guān)推薦：

img屬性中alt和title的區(qū)別圖文詳解

html中 img 標(biāo)簽之關(guān)于創(chuàng)建圖像映射詳解

html中為什么不使用img標(biāo)簽來控制圖片大小？

以上就是html img標(biāo)簽的使用的詳細(xì)內(nèi)容，html教程

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請第一時間聯(lián)系我們修改或刪除，多謝。