15. Image Trong HTML

Trong HTML, hình ảnh (image) có thể được hiển thị bằng thẻ <img>. Thẻ này cho phép bạn nhúng hình ảnh từ các nguồn như máy tính cá nhân, trang web khác, hoặc thậm chí từ cùng một thư mục với tệp HTML của bạn. Dưới đây là một ví dụ về cách sử dụng thẻ <img> để hiển thị hình ảnh trong HTML:

html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Hình ảnh trong HTML</title>
</head>
<body>
    <h2>Hình ảnh từ máy tính cá nhân:</h2>
    <img src="image.jpg" alt="Mô tả hình ảnh">
    
    <h2>Hình ảnh từ một trang web:</h2>
    <img src="https://www.example.com/image.jpg" alt="Mô tả hình ảnh từ trang web">
    
    <h2>Hình ảnh với kích thước cố định:</h2>
    <img src="photo.jpg" alt="Mô tả hình ảnh" width="300" height="200">
    
    <h2>Hình ảnh nhấp vào để mở liên kết:</h2>
    <a href="https://www.example.com">
        <img src="logo.png" alt="Logo" width="150" height="100">
    </a>
</body>
</html>

Trong ví dụ này:

Thẻ <img> được sử dụng để hiển thị hình ảnh.
Thuộc tính src chỉ định nguồn hình ảnh (URL hoặc đường dẫn tệp).
Thuộc tính alt cung cấp mô tả hình ảnh, hiển thị khi hình ảnh không thể tải hoặc để giúp người dùng không thể xem hình hiểu nội dung.
Thuộc tính width và height có thể được sử dụng để xác định kích thước hình ảnh.
Trong ví dụ cuối cùng, hình ảnh được đặt bên trong một thẻ <a> để tạo một liên kết xung quanh hình ảnh. Trên đây là giới thiệu về Image trong HTML

Leave a Comment Cancel Reply