Iframe HTML
Khung nội tuyến HTML được sử dụng để hiển thị một trang web trong một trang web.
Cú pháp khung nội tuyến HTML
Thẻ HTML <iframe>
chỉ định khung nội tuyến.
Khung nội tuyến được sử dụng để nhúng tài liệu khác trong tài liệu HTML hiện tại.
Cú pháp
<iframe src=" url " title=" description "></iframe>
Mẹo: Cách tốt nhất là luôn bao gồm thuộc tính title
cho <iframe>
. Điều này được trình đọc màn hình sử dụng để đọc nội dung của iframe.
Iframe - Đặt chiều cao và chiều rộng
Sử dụng thuộc tính height
và width
để chỉ định kích thước của iframe.
Chiều cao và chiều rộng được chỉ định bằng pixel theo mặc định:
Ví dụ
<iframe src="demo_iframe.htm" height="200" width="300"
title="Iframe Example"></iframe>
Hãy tự mình thử » Hoặc bạn có thể thêm thuộc tính style
và sử dụng thuộc tính height
và width
CSS:
Ví dụ
<iframe src="demo_iframe.htm" style="height:200px;width:300px;"
title="Iframe Example"></iframe>
Hãy tự mình thử » Iframe - Xóa đường viền
Theo mặc định, iframe có đường viền xung quanh nó.
Để xóa đường viền, hãy thêm thuộc tính style
và sử dụng thuộc tính CSS border
:
Ví dụ
<iframe src="demo_iframe.htm" style="border:none;"
title="Iframe Example"></iframe>
Hãy tự mình thử »Với CSS, bạn cũng có thể thay đổi kích thước, kiểu dáng và màu sắc của đường viền của iframe:
Ví dụ
<iframe src="demo_iframe.htm" style="border:2px solid red;"
title="Iframe Example"></iframe>
Hãy tự mình thử »Iframe - Mục tiêu cho một liên kết
Một iframe có thể được sử dụng làm khung đích cho một liên kết.
Thuộc tính target
của liên kết phải tham chiếu đến thuộc tính name
của iframe:
Ví dụ
<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe
Example"></iframe>
<p><a href="https://www.example.com.vn" target="iframe_a">W3Schools.com</a></p>
Hãy tự mình thử »Tóm tắt chương
- Thẻ HTML
<iframe>
chỉ định khung nội tuyến - Thuộc tính
src
xác định URL của trang cần nhúng - Luôn bao gồm thuộc tính
title
(dành cho trình đọc màn hình) - Thuộc tính
height
vàwidth
chỉ định kích thước của iframe - Sử dụng
border:none;
để xóa đường viền xung quanh iframe
Bài tập HTML
Thẻ khung nội tuyến HTML
Tag | Description |
---|---|
<iframe> | Defines an inline frame |
Để có danh sách đầy đủ tất cả các thẻ HTML có sẵn, hãy truy cập Tham khảo thẻ HTML của chúng tôi.