Dùng thẻ <img> (self-closing, không có thẻ đóng) để nhúng ảnh.
Thuộc tính chính
| Thuộc tính | Mô tả |
|---|---|
src | Đường dẫn ảnh (bắt buộc) |
alt | Văn bản thay thế (accessibility, SEO, load fail) |
width | Chiều rộng (px hoặc %) |
height | Chiều cao (px hoặc %) |
loading | lazy (tải lười) hoặc eager (mặc định) |
srcset | Responsive images (nhiều kích cỡ) |
sizes | Kích thước hiển thị cho srcset |
decoding | async, sync, auto |
Ví dụ cơ bản
<!DOCTYPE html>
<html>
<head>
<title>HTML img tag</title>
</head>
<body>
<h1>Tutorialspoint</h1>
<h2>Simply Easy Learning</h2>
<img src="/green/images/logo.png" alt="Tutorialspoint" width="260" height="100" loading="lazy">
</body>
</html>Responsive Image (Modern)
<img
srcset="small.jpg 480w, medium.jpg 800w, large.jpg 1200w"
sizes="(max-width: 600px) 480px, (max-width: 1000px) 800px, 1200px"
src="medium.jpg"
alt="Mô tả ảnh"
loading="lazy"
/>Lưu ý: Luôn có alt. Dùng loading="lazy" cho ảnh below-the-fold. SVG cho icon/logo (scale không mờ).