HTML <img> 標簽


實例

如何插入圖像:

<img src="smiley-2.gif" alt="Smiley face" width="42" height="42">

嘗試一下 ?
(更多實例見頁面底部)

瀏覽器支持

Internet ExplorerFirefoxOperaGoogle ChromeSafari

所有主流瀏覽器都支持 <img> 標簽。


標簽定義及使用說明

<img> 標簽定義 HTML 頁面中的圖像。

<img> 標簽有兩個必需的屬性:src 和 alt。

注釋:從技術上講,圖像并不會插入 HTML 頁面中,而是鏈接到 HTML 頁面上。<img> 標簽的作用是為被引用的圖像創建占位符。

提示:通過在 <a> 標簽中嵌套 <img> 標簽,給圖像添加到另一個文檔的鏈接。


HTML 4.01 與 HTML5之間的差異

HTML5 中不支持以下屬性:align、border、hspace、longdesc、vspace。

在 HTML 4.01 中,以下屬性:align、border、hspace、vspace 已廢棄


HTML 與 XHTML 之間的差異

在 HTML 中,<img> 標簽沒有結束標簽。

在 XHTML 中,<img> 標簽必須被正確地關閉。


屬性

New :HTML5 中的新屬性。

屬性 描述
align top
bottom
middle
left
right
HTML5 不支持。HTML 4.01 已廢棄。 規定如何根據周圍的文本來排列圖像。
alt text 規定圖像的替代文本。
border pixels HTML5 不支持。HTML 4.01 已廢棄。 規定圖像周圍的邊框。
crossoriginNew anonymous
use-credentials
設置圖像的跨域屬性
height pixels 規定圖像的高度。
hspace pixels HTML5 不支持。HTML 4.01 已廢棄。 規定圖像左側和右側的空白。
ismap ismap 將圖像規定為服務器端圖像映射。
longdesc URL HTML5 不支持。HTML 4.01 已廢棄。 指向包含長的圖像描述文檔的 URL。
src URL 規定顯示圖像的 URL。
usemap #mapname 將圖像定義為客戶器端圖像映射。
vspace pixels HTML5 不支持。HTML 4.01 已廢棄。 規定圖像頂部和底部的空白。
width pixels 規定圖像的寬度。


全局屬性

<img> 標簽支持 HTML 的全局屬性


事件屬性

<img> 標簽支持 HTML 的事件屬性


Examples

嘗試一下 - 實例

從不同的位置插入圖片
本例演示如何將其他文件夾或服務器的圖片顯示到網頁中。

制作圖像鏈接
本例演示如何將圖像作為一個鏈接使用。

創建圖像地圖
本例演示如何創建帶有可供點擊區域的圖像地圖。其中的每個區域都是一個超級鏈接。


相關文章

HTML 教程:HTML 圖像

HTML DOM 參考手冊: Image 對象