Thẻ iframe trong HTML

Thẻ iframe trong HTML được sử dụng để nhúng một trang web vào trang web hiện tại. Tham khảo tiếp bài viết dưới đây của Taimienphi.vn để tìm hiểu chi tiết thẻ iframe trong HTML.

Bài viết dưới đây Taimienphi.vn sẽ giới thiệu cho bạn về thẻ iframe trong HTML. Ngoài ra bạn đọc có thể tham khảo một số bài viết khác đã có trên Taimienphi.vn để tìm hiểu về thuộc tính id trong HTML.

the iframe trong html hoc html

Thẻ iframe trong HTML
 

Mục Lục bài viết:
1. Thẻ iframe trong HTML
2. Cú pháp iframe trong HTML
3. Thiết lập chiều cao và chiều rộng iframe trong HTML
4. Xóa đường viền trên iframe
5. Sử dụng iframe làm khung đích cho link

1. Thẻ iframe trong HTML

Chúng ta có thể chỉ định khung nội tuyến (inline frame) bằng cách sử dụng thẻ iframe. Thẻ iframe không liên quan đến thẻ frameset, và có thể xuất hiện ở vị trí bất kỳ trên tài liệu.

Thuộc tính src được sử dụng để chỉ định URL của trang chứa iframe.

2. Cú pháp iframe trong HTML

iframe trong HTML được chỉ định bằng thẻ iframe.

the iframe trong html

Thuộc tính src chỉ định URL (địa chỉ web) của trang chứa khung nội tuyến(inline frame).

 

3. Thiết lập chiều cao và chiều rộng iframe trong HTML

Chúng ta sử dụng các thuộc tính height width để chỉ định kích thước của iframe.

- Mặc định chiều cao và chiều rộng iframe được chỉ định bằng đơn vị pixel.

Ví dụ 1: trong ví dụ dưới đây chúng ta chỉ định kích thước cho iframe bằng đơn vị pixel:

the iframe trong html 2

Kết quả trả về sau khi áp dụng các thuộc tính height và width bằng đơn vị pixel để chỉ định kích thước của iframe có dạng như dưới đây:

the iframe trong html 3

- Ngoài ra chúng ta có thể chỉ định kích thước iframe bằng đơn vị phần trăm (%):

Ví dụ 2: trong ví dụ dưới đây chúng ta chỉ định kích thước cho iframe bằng đơn vị %:

the iframe trong html 4

Kết quả trả về sau khi áp dụng các thuộc tính height và width bằng đơn vị % để chỉ định kích thước của iframe có dạng như dưới đây:

the iframe trong html 5

- Hoặc sử dụng CSS để thiết lập chiều rộng và chiều cao iframe.
Ví dụ 3: trong ví dụ này chúng ta sử dụng CSS để thiết lập chiều rộng và chiều cao cho iframe:

the iframe trong html 6

Kết quả trả về sau khi áp dụng CSS để chỉ định kích thước của iframe có dạng như dưới đây:

the iframe trong html 7

4. Xóa đường viền trên iframe

Mặc định iframe có đường viền xung quanh.
Để xóa đường viền này, chúng ta thêm thuộc tính style và sử dụng thuộc tính border trong CSS.
Ví dụ 1: trong ví dụ dưới đây minh họa cách xóa đường viền cho iframe trong HTML:

the iframe trong html 8

Kết quả trả về có dạng như dưới đây:

the iframe trong html 9

Với CSS, chúng ta có thể thay đổi kích thước, style và màu sắc cho đường viền của iframe.
Ví dụ 2: trong ví dụ dưới đây chúng ta sẽ thay đổi kích thước, style và màu sắc cho đường viền của iframe:

the iframe trong html 10

Kết quả trả về có dạng như dưới đây:

the iframe trong html 11

5. Sử dụng iframe làm khung đích cho link

Ngoài ra chúng ta có thể sử dụng iframe để làm khung đích cho link (liên kết).
Thuộc tính target của link (liên kết) phải tham chiếu đến thuộc tính name của iframe.
Ví dụ: trong ví dụ dưới đây chúng ta sử dụng iframe làm khung đích cho link:

the iframe trong html 12

Kết quả trả về có dạng như dưới đây:

the iframe trong html 13

https://thuthuat.taimienphi.vn/the-iframe-trong-html-50638n.aspx
Bài viết trên đây Taimienphi.vn vừa giới thiệu cho bạn thẻ iframe trong HTML. Ngoài ra nếu có bất kỳ thắc mắc hoặc câu hỏi nào cần giải đáp, bạn đọc có thể để lại ý kiến của mình trong phần bình luận bên dưới bài viết nhé. Bạn muốn học HTML và tìm hiểu thêm trong bài viết tiếp theo Taimienphi.vn sẽ giới thiệu tiếp cho bạn về cách nhúng JavaScript vào HTML.

Tác giả: Lê Thị Thuỷ     (4.0★- 3 đánh giá)  ĐG của bạn?

  

Bài viết liên quan

URL trong HTML là gì? cấu trúc như thế nào?
JavaScript trong HTML
Thuộc tính id trong HTML, thẻ ID
Responsive Web Design trong HTML
Thẻ quote trong HTML
Từ khoá liên quan:

the iframe trong html

, iframe trong html, html,

SOFT LIÊN QUAN
  • HTML Creator

    Phần mềm thiết kế web cho người mới

    HTML Creator là phần mềm dành cho người mới học HTML, hỗ trợ người dùng tạo webpage cơ bản kèm theo thiết bị đơn giản mà không cần viết mã (code). Mục đích cuối cùng của người học khi sử dụng HTML Creator là làm quen với cấu trúc khối của ngôn ngữ HTML và xem mã HTML tương ứng trông ra sao khi tạo trang.

Tin Mới

  • Sự khác nhau giữa JSON và XML

    XML (Extensible Markup Language) và JSON (JavaScript Object Notation) là 2 định dạng trao đổi dữ liệu phổ biến nhất hiện nay. So sánh JSON và XML, sự khác nhau giữa JSON và XML là gì? Cùng theo dõi bài viết dưới đây để tìm hiểu nhé.

  • Danh sách (list) trong HTML

    Bài viết trước bạn đọc đã cùng Taimienphi.vn tìm hiểu về bảng (table) trong HTML. Trong bài viết tiếp theo dưới đây Taimienphi.vn sẽ giới thiệu tiếp cho bạn về danh sách (list) trong

  • Thẻ img trong HTML

    Trên các trang web đều sử dụng hình ảnh minh họa để làm nổi bật nội dung, đồng thời để tránh người dùng cảm thấy khó chịu vì text quá dài. Trong HTML hình ảnh được chỉ định bằng thẻ img. Tham khaor tiếp bài viết dưới

  • Bình giảng bài thơ Đò lèn của Nguyễn Duy

    Bằng những hiểu biết của mình, em hãy viết bài văn ngắn gọn Bình giảng bài thơ Đò lèn của Nguyễn Duy, qua đó trình bày những suy nghĩ, đánh giá, cảm nhận của bản thân về cái hay, cái đẹp trong nội dung và nghệ thuật của tác phẩm.


 Mùa hè tới rồi muốn so sánh giá tìm điều hòa giá rẻ nhất thị trường hãy dùng TopGia để so sanh gia có nhiều mẫu dieu hoa để so sanh sanh, xem dieu hoagiá rẻ để so sánh giá