Chào các bạn,
Sau thẻ a để chèn liên kết vào trang web, thẻ tiếp theo mình muốn giới thiệu tới các bạn đó là thẻ img – thẻ sử dụng để chèn hình ảnh vào trang web.
I. Chèn hình ảnh với thẻ img
Thẻ img trong HTML có cấu trúc như sau:
<img src="https://phambinh.net/wp-content/uploads/2019/07/phambinh_logo.png" />
Một thuộc tính rất quan trọng luôn đi kèm với thẻ img đó là thuộc tính src, giá trị của thuộc tính này chính là liên kết tới file ảnh bạn muốn chèn lên trang web. Trong ví dụ trên, hình ảnh mình muốn chèn chính là file logo của phambinh.net.
Dưới đây là kết quả hiển thị của đoạn code trên.

II. Một số thuộc tính thường dùng với thẻ img
Ngoài thuộc tính bắt buộc src ra, thì thẻ img còn có một số thuộc tính tùy chọn khác mà mình sẽ liệt kê trong bảng dưới đây.
Thuộc tính | Giá trị | Mô tả |
alt | Mô tả về hình ảnh | Mô tả về hình ảnh, trong trường hợp ảnh không hiển thị được thì trình duyệt sẽ hiển thị nội dung này thay cho bức ảnh. Thẻ này có giá trị đặc biệt cho làm SEO. |
height | pixels | Chỉnh chiều cao hiển thị của ảnh |
width | pixels | Chỉnh chiều rộng hiển thị của ảnh |
III. Tổng kết
Bên cạnh nội dung văn bản, thì hình ảnh cũng là một dạng nội dung phổ biến trên web. Vì thế thao tác chèn hình ảnh vào website cũng được sử dụng nhiều và đang trở thành xu hướng.
Có 2 điều khi chèn ảnh lên website mà bạn cần lưu ý:
- Thẻ img luôn đi kèm với thuộc tính alt để tối ưu hóa công cụ tìm kiếm tốt hơn.
- Kích thước của ảnh không nên quá lớn, không nên vượt quá 500KB/ảnh để tránh trường hợp ảnh load quá lâu, tốn lưu lượng của người sử dụng.
Bài viết tới đây là kết thúc. Hẹn gặp lại bạn trong bài viết kế tiếp.
- Bài 1: Ngôn ngữ HTML là gì?
- Bài 2: Các khái niệm thường gặp trong HTML
- Bài 3: Cấu trúc trang HTML
- Bài 4: Các thẻ định dạng văn thường gặp trong HTML
- Bài 5: Chèn liên kết vào trang web với thẻ a trong HTML
- Bài 6: Chèn hình ảnh vào trang web với thẻ img trong HTML
- Bài 7: Chèn một trang web khác vào trang web của mình với thẻ iframe trong HTML
- Bài 8: Tạo bảng với HTML
- Bài 9: Tạo một danh sách với HTML
- Bài 10: Các thẻ input, thẻ tạo form nhập liệu trong HTML
- Bài 11: Kết thúc serie học HTML cơ bản