Tag <img /> dùng để nhúng một image vào văn bản HTML
Tag <img /> có 2 thuộc tính cần thiết là src và alt, trong đó:
src: đường dẫn tham chiếu tới image.
alt: được sử dụng như một văn bản thay thế khi image không hiển thị (hoặc không có sẵn). Chú ý là alt không phải dùng để hiển thị khi di chuyển chuột lên image, muốn văn bản hiển thị khi di chuyển chuột lên image thì ta dùng thuộc tính title thay thế.
Sự khác nhau giữa HTML và XHTML
HTML4.01
XHTML1.0
XHTML1.1
Không cần kết thúc tag <img>
Cần khoảng trắng và ký tự "/" để kết thúc tag <img />
Image "img_sakura.jpg" được đặt trong folder "images"
Hiển thị trình duyệt:
Khi đường dẫn sai, thuộc tính "alt" sẽ phát huy tác dụng:
Sakura
Trình duyệt hỗ trợ
<img /> được hỗ trợ trong đa số các trình duyệt.
Thuộc tính
Cách sử dụng: <img thuoctinh="giatri" />
Thuộc tính bắt buộc
Thuộc tính
Giá trị
Ví dụ
Mô tả
alt
Text
alt="Đây là alt"
Xác định text thay thế cho image.
src
URL
src="img/ img_name.gif"
Xác định đường dẫn tham chiếu của image
Thuộc tính tùy chọn
Thuộc tính
Giá trị
Ví dụ
Mô tả
align
top bottom middle left right
align="top"
Được dùng để sắp xếp vị trí của image theo thành phần bao ngoài. Không khuyến khích sử dụng, sử dụng thuộc tính text-align của css để thay thế. Không được hỗ trợ trong DTD Strict
border
pixels
border="1px"
Xác định chiều rộng đường viền bao quanh image. Không khuyến khích sử dụng, sử dụng thuộc tính border của css để thay thế. Không được hỗ trợ trong DTD Strict
height
pixels %
height="50px"
Xác định chiều cao của image
hspace
pixels
hspace="5px"
Xác định khoảng trắng bên trái và phải của image. Không khuyến khích sử dụng, sử dụng thuộc tính padding của css để thay thế. Không được hỗ trợ trong DTD Strict
ismap
ismap
ismap="ismap"
Sử dụng thuộc tính này thì khi click lên image, tọa độ vị trí click chuột sẽ gửi lên server như một chuổi truy vấn URL.
longdesc
URL
longdesc="des.html"
Xác định một trang có chứa mô tả chi tiết nội dung của image thông qua tham số URL.
usemap
#mapname
usemap=" #mapName"
Xác định một image thuộc khu vực image map khi sử dụng <map>.
vspace
pixels
vspace="5px"
Xác định khoảng trắng bên trên và dưới của image. Không khuyến khích sử dụng, sử dụng thuộc tính padding của css để thay thế. Không được hỗ trợ trong DTD Strict
width
pixels %
width="50px"
Xác định chiều rộng của image
Thuộc tính tổng quát (xem thêm)
Thuộc tính
Giá trị
Ví dụ
Mô tả
class
Tên class
class="section"
Tên class
dir
rtl ltr
dir="rtl"
Xác định hướng văn bản cho các nội dung trong một thành phần.
id
Tên id
id="layout"
Xác định tên id cho thành phần, mỗi thành phần chỉ có một id duy nhất (hoặc một id chỉ có trong một thành phần) trong một văn bản HTML
lang
Mã ngôn ngữ
lang="vi"
Xác định mã ngôn ngữ cho nội dung trong một thành phần.
style
Kiểu định dạng
style="color: red"
Xác định một định dạng cho một thành phần.
title
Text
title="Đây là title"
Xác định thêm thông tin cho thành phần.
xml:lang
Mã ngôn ngữ
lang="vi"
Xác định mã ngôn ngữ cho nội dung trong một thành phần, trong văn bản XHTML.
Thuộc tính sự kiện
Không được hỗ trợ trong DTD Strict
Thuộc tính
Giá trị
Ví dụ
Mô tả
onclick
Code script
onclick="code"
Script chạy khi click chuột.
ondblclick
Code script
ondblclick="code"
Script chạy khi double click chuột.
onmousedown
Code script
onmousedown="code"
Script chạy khi button chuột được nhấn.
onmousemove
Code script
onmousemove="code"
Script chạy khi di chuyển con trỏ chuột.
onmouseout
Code script
onmouseout="code"
Script chạy khi di chuyển con trỏ chuột ra khỏi thành phần.
onmouseover
Code script
onmouseover="code"
Script chạy khi di chuyển con trỏ chuột di chuyển trên thành phần.
onmouseup
Code script
onmouseup="code"
Script chạy khi button chuột được thả ra.
onkeydown
Code script
onkeydown="code"
Script chạy khi nút trên bàn phím được nhấn.
onkeypress
Code script
onkeypress="code"
Script chạy khi nút trên bàn phím được nhấn và thả ra.
