Thẻ <img> chèn hình ảnh vào HTMLThẻ <img> được dùng để nhúng một hình ảnh vào trang HTML. Thẻ này có vài thuộc tính và nó không có phần đóng thẻ. Địa chỉ URL dẫn đến vị trí của ảnh được xác định thông qua thuộc tính src. Cú pháp chèn ảnh có dạng: Show Vị trí URL ảnh phải nằm giữa dấu nháy kép "...", ví dụ bạn có một ảnh có tên "flower.jpg" lưu trữ cùng thư mục với file HTML, thì hiện thị ảnh có thể có dạng: <html> <head> <title>Ví dụ về ảnh</title> </head> <body> <img src="flower.jpg" alt="" /> </body> </html>Trong trường hợp ảnh không hiện thị được (ví dụ ảnh bị xóa ...) thì thuộc tính alt là một văn bản thay thế sẽ hiện thị thay cho ảnh. Nói chung bất kỳ ảnh nào trong HTML thì thuộc tính alt yêu cầu nên có. Thuộc tính width và height - điều chỉnh cỡ ảnh <img>Điều chỉnh cỡ ảnh hiện thị bạn có thể chỉ ra chiều rộng và chiều cao của ảnh thông qua thuộc tính width và height. Đơn vị sử dụng là pixel px hoặc phần trăm % <html> <head> <title>Thẻ IMG</title> </head> <body> <img src="flower.jpg" height="150px" width="150px" alt="" /> <!-- hoặc --> <img src="flower.jpg" height="50%" width="50%" alt="" /> </body> </html>Khi sử dụng ảnh trong trang web, sẽ mất thời gian để tải ảnh về và hiện thị, nên bạn cần lưu ý chọn cỡ ảnh gốc sao cho phù hợp với yêu cầu hiện thị của trang Đường viền khung ảnh - borderMặc định, anh không có đường viền bao quanh. Để tạo đường viền bao quanh ảnh sử dụng thuộc tính border và chỉ ra kích cỡ của đường viền theo đơn vị px Viết code HTML, có một số URL ảnh sau:
Hãy viết code hiện thị ảnh và xem kết quả ra sao ở hộp sau:
<html>
<head>
<title>Ví dụ về ảnh</title>
</head>
<body>
<img
border="4px"
width="700px"
src="https://raw.githubusercontent.com/xuanthulabnet/learn-php/master/imgs/php-004.png"
alt="vi du" />
</body>
</html>
Mục lục bài viết
ĐĂNG KÝ KÊNH, XEM CÁC VIDEO TRÊN XUANTHULAB
|
