Phần tử HTML là gì? Phần tử là các khối xây dựng của HTML mô tả cấu trúc và nội dung của một trang web. Chúng là phần “Đánh dấu” của Ngôn ngữ Đánh dấu Siêu văn bản (HTML). Cú pháp HTML sử dụng dấu ngoặc nhọn (”<” và ”>”) để giữ tên của một phần tử HTML. Các phần tử thường là

Bạn đang xem: thẻ html là gì

Phần tử HTML là gì?

< p> Phần tử là các khối xây dựng của HTML mô tả cấu trúc và nội dung của một trang web. Chúng là phần “Đánh dấu” của Ngôn ngữ Đánh dấu Siêu văn bản (HTML).

Cú pháp HTML sử dụng các dấu ngoặc nhọn (”& lt;” và ”& gt;”) để giữ tên của một phần tử HTML. Các phần tử thường có thẻ mở và thẻ đóng và cung cấp thông tin về nội dung mà chúng chứa. Sự khác biệt giữa hai thẻ này là thẻ đóng có dấu gạch chéo lên phía trước.

Hãy xem một số ví dụ cụ thể về thẻ HTML.

p Element

Thẻ & lt; p & gt; là viết tắt của đoạn văn, là thẻ phổ biến nhất được sử dụng để tạo các dòng văn bản bên trong tài liệu HTML.

Việc sử dụng & lt; p & gt; tương thích với các thẻ khác, cho phép thêm siêu liên kết ( & lt; a & gt; ) và văn bản in đậm ( & lt; strong & gt; ) , trong số những thứ khác.

Ví dụ

  & lt; html & gt;
  & lt; đầu & gt;
    & lt; title & gt; Ví dụ về đoạn văn & lt; / title & gt;
  & lt; / head & gt;
  & lt; body & gt;
    & lt; p & gt;
      Đây là một đoạn văn. Nó là cái đầu tiên trong số nhiều cái.
    & lt; / p & gt;
    & lt; p & gt;
      Đây là một đoạn văn khác. Nó sẽ xuất hiện trên một dòng riêng biệt.
    & lt; / p & gt;
  & lt; / body & gt;
& lt; / html & gt;
 

Bạn cũng có thể lồng một phần tử neo & lt; a & gt; trong một đoạn văn.

Ví dụ

  & lt; p & gt; Đây là & lt; a href = "https://freecodecamp.org" & gt; liên kết tới freeCodeCamp & lt; / a & gt;. & lt; / p & gt;  

Phần tử tiêu đề

Có sáu phần tử tiêu đề – & lt; h1 & gt; , & lt; h2 & gt; , & lt; h3 & gt; , & lt; h4 & gt; , & lt; h5 & gt; , & lt; h6 & gt; .

Các yếu tố tiêu đề được sử dụng để biểu thị tầm quan trọng của nội dung bên dưới chúng. Số lượng tiêu đề càng thấp thì tầm quan trọng càng cao.

Ví dụ: phần tử & lt; h1 & gt; đại diện cho tiêu đề chính của trang và chỉ nên có một phần tử trên mỗi trang. Điều này giúp các công cụ tìm kiếm hiểu chủ đề chính của trang. Các phần tử & lt; h2 & gt; có ít tầm quan trọng hơn và phải thấp hơn phần tử & lt; h1 & gt; cấp cao hơn.

Ví dụ

  & lt; h1 & gt; Đây là tiêu đề chính. & Lt; / h1 & gt;
& lt; h2 & gt; Đây là tiêu đề phụ h2. & lt; / h2 & gt;
& lt; h3 & gt; Đây là tiêu đề phụ h3. & lt; / h3 & gt;
& lt; h4 & gt; Đây là tiêu đề phụ h4. & lt; / h4 & gt;
& lt; h5 & gt; Đây là tiêu đề phụ h5. & lt; / h5 & gt;
& lt; h6 & gt; Đây là tiêu đề phụ h6. & lt; / h6 & gt;
 

a Element

Phần tử anchor ( & lt; a & gt; ) tạo một siêu liên kết đến một trang khác hoặc tập tin. Để liên kết đến một trang hoặc tệp khác, thẻ & lt; a & gt; cũng phải chứa thuộc tính href , cho biết đích của liên kết.

Văn bản giữa các thẻ & lt; a & gt; mở và đóng sẽ trở thành liên kết. Văn bản này phải là một mô tả có ý nghĩa về đích liên kết và không phải là một cụm từ chung chung, chẳng hạn như “Nhấp vào đây”. Điều này tốt hơn cho phép người dùng có trình đọc màn hình điều hướng giữa các liên kết khác nhau trên một trang và hiểu nội dung mà mỗi liên kết sẽ liên kết đến.

Theo mặc định, một trang được liên kết được hiển thị trong cửa sổ trình duyệt hiện tại trừ khi có mục tiêu khác được chỉ định. Các kiểu liên kết mặc định như sau:

  • Một liên kết không truy cập được gạch chân và có màu xanh lam
  • Một liên kết đã truy cập được gạch chân và có màu tím
  • Một liên kết đang hoạt động là gạch chân và màu đỏ

Ví dụ

  & lt; a href =" https: //guide.freecodecamp .org / "& gt; freeCodeCamp & lt; / a & gt;
 

Bạn cũng có thể tạo liên kết đến một phần khác trên cùng một trang:

  & lt; h1 id = "top" & gt; & lt; / h1 & gt;
  & lt; a href = "#top" & gt; Lên đầu trang & lt; / a & gt;
 

Một hình ảnh cũng có thể được chuyển thành liên kết bằng cách đặt thẻ & lt; img & gt; trong thẻ & lt; a & gt; :

  & lt; a href = "https://guide.freecodecamp.org/"><img src =" logo.svg "& gt; & lt; / a & gt;
 

List Elements

Có hai loại danh sách chính trong HTML: có thứ tự ( & lt; ol & gt; ) và không có thứ tự ( & lt; ul & gt; ). Tất cả danh sách phải chứa một hoặc nhiều phần tử danh sách ( & lt; li & gt;).

Danh sách không có thứ tự

Danh sách không có thứ tự bắt đầu bằng thẻ & lt; ul & gt; và các mục danh sách bắt đầu bằng thẻ & lt; li & gt; . Trong danh sách không có thứ tự, tất cả các mục danh sách được đánh dấu bằng dấu đầu dòng theo mặc định.

  & lt; ul & gt;
  & lt; li & gt; Mục & lt; / li & gt;
  & lt; li & gt; Mục & lt; / li & gt;
  & lt; li & gt; Mục & lt; / li & gt;
& lt; / ul & gt;
 

Đầu ra:

  • Mặt hàng
  • Mặt hàng
  • Mặt hàng

Danh sách có thứ tự

Danh sách có thứ tự bắt đầu bằng thẻ & lt; ol & gt; và các mục trong danh sách bắt đầu bằng & lt; li & gt; thẻ. Trong danh sách có thứ tự, tất cả các mục trong danh sách đều được đánh dấu bằng số.

  & lt; ol & gt;
  & lt; li & gt; Mục Đầu tiên & lt; / li & gt;
  & lt; li & gt; Mặt hàng thứ hai & lt; / li & gt;
  & lt; li & gt; Mặt hàng thứ ba & lt; / li & gt;
& lt; / ol & gt;
 

Đầu ra:

  1. Mặt hàng đầu tiên
  2. Mặt hàng thứ hai
  3. Mặt hàng thứ ba
  4. em Phần tử

    Phần tử & lt; em & gt; được sử dụng để nhấn mạnh văn bản trong tài liệu HTML. Điều này có thể được thực hiện bằng cách gói văn bản bạn muốn được nhấn mạnh trong thẻ & lt; em & gt; và thẻ & lt; / em & gt; tương ứng. Hầu hết các trình duyệt sẽ hiển thị văn bản được bao bọc trong thẻ & lt; em & gt; ở dạng in nghiêng.

    Lưu ý: Không nên sử dụng thẻ & lt; em & gt; kiểu chữ nghiêng văn bản. Thẻ & lt; em & gt; được sử dụng để nhấn mạnh vào văn bản. Thông thường, định dạng CSS được sử dụng để in nghiêng văn bản theo phong cách.

    Ví dụ

      & lt; body & gt;
      & lt; p & gt;
        Văn bản yêu cầu nhấn mạnh phải xuất hiện & lt; em & gt; đây & lt; / em & gt ;.
      & lt; / p & gt;
    & lt; / body & gt;
     

    i Element

    Phần tử & lt; i & gt; được sử dụng để biểu thị văn bản được đặt ngoài văn bản xung quanh của nó theo một cách nào đó. Theo mặc định, văn bản được bao quanh bởi các thẻ & lt; i & gt; sẽ được hiển thị ở dạng in nghiêng.

    Trong các đặc tả HTML trước đây, thẻ & lt; i & gt; chỉ được sử dụng để biểu thị văn bản được in nghiêng. Tuy nhiên, trong HTML ngữ nghĩa hiện đại, các thẻ như & lt; em & gt; & lt; strong & gt; nên được sử dụng khi thích hợp.

    Bạn có thể sử dụng thuộc tính class của phần tử & lt; i & gt; để nêu lý do tại sao văn bản trong thẻ khác với văn bản xung quanh. Bạn có thể muốn chứng minh rằng văn bản hoặc cụm từ là từ một ngôn ngữ khác:

      & lt; p & gt; Cụm từ tiếng Pháp & lt; i class = "french" & gt; esprit de Corps & lt; / i & gt; thường
    được sử dụng để mô tả cảm giác gắn kết nhóm và tình đồng nghiệp. & lt; / p & gt;
     

    strong Element

    Phần tử & lt; strong & gt; được sử dụng để biểu thị văn bản có tầm quan trọng cao hoặc khẩn cấp. Hầu hết các trình duyệt sẽ hiển thị văn bản được bao bọc trong thẻ & lt; strong & gt; ở dạng in đậm.

    Lưu ý: Không nên sử dụng thẻ & lt; strong & gt; để định kiểu văn bản là in đậm. Sử dụng CSS để làm điều đó.

    Ví dụ:

      & lt; body & gt;
      & lt; p & gt;
        & lt; mạnh & gt; Cái này & lt; / strong & gt; là thực sự quan trọng.
      & lt; / p & gt;
    & lt; / body & gt;
     

    img Phần tử

    Một phần tử HTML & lt; img & gt; đơn giản có thể được đưa vào tài liệu HTML như cái này:

      & lt; img src = "path / to / image / file" alt = "đây là một bức ảnh thú vị" title = "Một số văn bản mô tả ở đây "& gt;
     

    Lưu ý rằng các phần tử & lt; img & gt; tự đóng và không yêu cầu thẻ đóng.

    alt < / code> thẻ cung cấp văn bản thay thế cho hình ảnh. Một cách sử dụng thẻ alt dành cho người khiếm thị sử dụng trình đọc màn hình; chúng có thể được đọc thẻ alt của hình ảnh để hiểu ý nghĩa của hình ảnh.

    Thuộc tính title là tùy chọn và sẽ cung cấp thêm thông tin về bức hình. Hầu hết các trình duyệt hiển thị thông tin này trong chú giải công cụ khi người dùng di chuột qua nó.

    Lưu ý rằng đường dẫn đến tệp hình ảnh có thể là tương đối hoặc tuyệt đối. Ngoài ra, hãy nhớ rằng phần tử img là phần tử tự đóng, có nghĩa là nó không đóng bằng thẻ & lt; / img & gt; và thay vào đó, phần tử này chỉ đóng bằng một duy nhất & gt; .

    Ví dụ

      & lt; img src =" https: // example .com / image.png "alt =" hình ảnh của tôi "title =" Đây là một hình ảnh mẫu "& gt;
     

    (Điều này giả sử rằng tệp HTML ở https://example.com/index.html , vì vậy, nó nằm trong cùng một thư mục với tệp hình ảnh )

    giống như:

      & lt; img src = "image.png" alt = "my picture" title = "This là một hình ảnh ví dụ "& gt;
     

    Đôi khi một phần tử & lt; img & gt; cũng sẽ sử dụng hai thuộc tính khác để chỉ định kích thước của nó, height width < / code>, như hình dưới đây:

      & lt; img src = "image.png" alt = "my picture" width = "650" height = "400 "/ & gt;
     

    Các giá trị được chỉ định bằng pixel, nhưng kích thước thường được chỉ định trong CSS hơn là HTML.

    < p> Phần tử & lt; nav & gt; dành cho khối liên kết điều hướng chính. KHÔNG phải tất cả các liên kết của tài liệu đều phải nằm trong phần tử & lt; nav & gt; .

    Các trình duyệt, chẳng hạn như trình đọc màn hình cho người dùng bị khuyết tật, có thể sử dụng phần tử này để xác định xem có bỏ qua phần tử hiển thị ban đầu của nội dung này.

    Ví dụ

      & lt; nav class = "menu" & gt;
      & lt; ul & gt;
        & lt; li & gt; & lt; a href = "#" & gt; Trang chủ & lt; / a & gt; & lt; / li & gt;
        & lt; li & gt; & lt; a href = "#" & gt; Giới thiệu & lt; / a & gt; & lt; / li & gt;
        & lt; li & gt; & lt; a href = "#" & gt; Liên hệ & lt; / a & gt; & lt; / li & gt;
      & lt; / ul & gt;
    & lt; / nav & gt;  

    Phần tử tiêu đề

    & lt; header & gt; thẻ là một vùng chứa được sử dụng cho các liên kết điều hướng hoặc nội dung giới thiệu. Nó thường có thể bao gồm các phần tử tiêu đề, chẳng hạn như & lt; h1 & gt; , & lt; h2 & gt; , nhưng cũng có thể bao gồm các phần tử khác như biểu mẫu tìm kiếm, biểu trưng, ​​thông tin tác giả, v.v. Nó cũng có thể được sử dụng nhiều lần trong tài liệu HTML. Điều quan trọng cần lưu ý là thẻ & lt; header & gt; không giới thiệu một phần mới mà chỉ đơn giản là phần đầu của một phần.

    Ví dụ

      & lt; article & gt;
      & lt; tiêu đề & gt;
        & lt; h1 & gt; Tiêu đề của Trang & lt; / h1 & gt;
      & lt; / tiêu đề & gt;
        & lt; p & gt; Lorem ipsum dolor sit amet, consectetur adipiscing elit. & lt; / p & gt;
    & lt; / article & gt;  

    textarea Element

    Thẻ HTML textarea cho phép bạn nhập một hộp sẽ chứa văn bản cho phản hồi hoặc tương tác của người dùng. Trong hầu hết các trường hợp, người ta thường thấy textarea được sử dụng như một phần của biểu mẫu.

    Các lập trình viên sử dụng thẻ textarea để tạo trường nhiều dòng cho người dùng nhập (đặc biệt hữu ích trong trường hợp người dùng có thể đặt tạo thành văn bản dài hơn). Người lập trình có thể chỉ định các thuộc tính khác nhau cho các thẻ textarea.

    Ví dụ

      & lt; form & gt;
          & lt; textarea name = "comment" rows = "8" cols = "80" maxlength = "500" placeholder = "Nhập nhận xét của bạn ở đây ..." bắt buộc & gt; & lt; / textarea & gt;
        & lt; / form & gt;  

    Các thuộc tính phổ biến nhất: thuộc tính row cols xác định chiều cao và chiều rộng của textarea placeholder Thuộc tính chỉ định văn bản hiển thị cho người dùng, nó giúp người dùng hiểu dữ liệu nào nên được nhập vào thuộc tính maxlength xác định độ dài tối đa của văn bản có thể được nhập vào vùng văn bản , người dùng không thể gửi thêm các ký tự Bắt buộc thuộc tính có nghĩa là trường này phải được điền trước khi gửi biểu mẫu.

    label Element

    Thẻ & lt; label & gt; xác định nhãn cho phần tử & lt; input & gt; .

    Một nhãn có thể được liên kết với một phần tử bằng cách sử dụng thuộc tính “for” hoặc bằng cách đặt phần tử bên trong phần tử.

    Ví dụ

      & lt; label for =" id "& gt; Label & lt; / label & gt;
    & lt; input type = "text" name = "text" id = "id" value = "yourvalue" & gt; & lt; br & gt;  

    Như bạn có thể thấy, thuộc tính for của Thẻ phải bằng thuộc tính id của phần tử liên quan để liên kết chúng với nhau.

    Thuộc tính hỗ trợ nền tảng

    Thuộc tính

    Thuộc tính chung

    Thẻ & lt; label & gt; hỗ trợ Thuộc tính chung trong HTML.

    Thuộc tính sự kiện

    Thẻ & lt; label & gt; hỗ trợ các Thuộc tính sự kiện trong HTML.

    Phần tử & lt; label & gt; không hiển thị bất kỳ thứ gì đặc biệt cho người dùng. Tuy nhiên, nó cung cấp một cải tiến về khả năng sử dụng cho người dùng chuột, vì nếu người dùng nhấp vào văn bản trong phần tử , nó sẽ chuyển đổi điều khiển.

    < strong> Thẻ meta

    Thẻ & lt; meta & gt; cung cấp siêu dữ liệu về tài liệu HTML.

    Siêu dữ liệu này được sử dụng để chỉ định bộ ký tự, mô tả, từ khóa, tác giả và chế độ xem của trang.

    Siêu dữ liệu này sẽ không xuất hiện trên chính trang web, nhưng nó sẽ được người duyệt và công cụ tìm kiếm sử dụng để xác định cách trang sẽ hiển thị nội dung và đánh giá mức độ tối ưu hóa của công cụ tìm kiếm (SEO).

    Ví dụ

     & lt; head & gt;
      & lt; meta charset = "UTF-8" & gt;
      & lt; meta name = "description" content = "Mô tả ngắn gọn về nội dung trang web tại đây" & gt;
      & lt; meta name = "keywords" content = "HTML, CSS, XML, JavaScript" & gt;
      & lt; meta name = "author" content = "Jane Smith" & gt;
      & lt; meta name = "viewport" content = "width = device-width, initial-scale = 1.0" & gt;
    & lt;! - HTML5 đã giới thiệu một phương pháp cho phép các nhà thiết kế web kiểm soát chế độ xem, thông qua & lt; meta & gt; nhãn. Chế độ xem là vùng hiển thị của người dùng trên một trang web. Đ & lt; meta & gt; phần tử khung nhìn cung cấp cho trình duyệt hướng dẫn về cách kiểm soát kích thước và tỷ lệ của trang. - & gt;
    & lt; / head & gt;  

    div Element

    & lt; div & gt; thẻ là một vùng chứa chung xác định một phần trong tài liệu HTML của bạn. Phần tử & lt; div & gt; được sử dụng để nhóm các phần của phần tử HTML lại với nhau và định dạng chúng bằng CSS.

    & lt; div & gt; là một phần tử cấp khối. Điều này có nghĩa là nó chiếm dòng riêng trên màn hình. Các phần tử ngay sau & lt; div & gt; sẽ được đẩy xuống dòng bên dưới. Để tạo kiểu và nhóm tương tự không phải ở cấp độ khối mà là ở dòng nội tuyến, bạn sẽ sử dụng thẻ & lt; span & gt; để thay thế. Thẻ được sử dụng để nhóm các phần tử nội dòng trong một tài liệu.

    Ví dụ

    Đây là ví dụ về cách hiển thị một phần có cùng màu:

      & lt; div style = "color: # ff0000" & gt;
      & lt; h3 & gt; tiêu đề của tôi & lt; / h3 & gt;
      & lt; p & gt; đoạn văn của tôi & lt; / p & gt;
    & lt; / div & gt;  

    Phần tử

    Phần tử & lt; section & gt; xác định một phần ở đó không phải là một phần tử HTML ngữ nghĩa cụ thể hơn để đại diện cho nó. Thông thường, phần tử & lt; section & gt; sẽ bao gồm phần tử tiêu đề ( & lt; h1 & gt; - & lt; h6 & gt; ) làm phần tử con. < / p>

    Ví dụ: một trang web có thể được chia thành nhiều phần khác nhau như phần chào mừng, phần nội dung và phần liên hệ.

    Phần tử & lt; section & gt; không được được sử dụng thay cho phần tử & lt; div & gt; nếu cần một vùng chứa chung. Nó sẽ được sử dụng để xác định các phần trong một trang HTML.

      & lt; html & gt;
    & lt; đầu & gt;
      & lt; title & gt; Phần Ví dụ & lt; / title & gt;
    & lt; / head & gt;
    & lt; body & gt;
      & lt; phần & gt;
        & lt; h1 & gt; Tiêu đề & lt; / h1 & gt;
        & lt; p & gt; Hàng loạt nội dung tuyệt vời & lt; / p & gt;
      & lt; / phần & gt;
    & lt; / body & gt;
    & lt; / html & gt;
     

    Thẻ & lt; footer & gt; biểu thị phần chân trang của tài liệu hoặc phần HTML. Thông thường, chân trang chứa thông tin về tác giả, thông tin bản quyền, thông tin liên hệ và sơ đồ trang web. Mọi thông tin liên hệ bên trong thẻ & lt; footer & gt; phải nằm trong thẻ & lt; address & gt; .

    < strong> Ví dụ

      & lt; html & gt;
    & lt; đầu & gt;
      & lt; title & gt; Ví dụ về đoạn văn & lt; / title & gt;
    & lt; / head & gt;
    & lt; body & gt;
      & lt; footer & gt;
        & lt; p & gt; & amp; copy; Joe Smith năm 2017 & lt; / p & gt;
      & lt; / footer & gt;
    & lt; / body & gt;
    & lt; / html & gt;  

    Phần tử âm thanh

    & lt; audio & gt; thẻ xác định một phần tử âm thanh, có thể được sử dụng để thêm tài nguyên phương tiện âm thanh vào tài liệu HTML sẽ được phát bằng hỗ trợ gốc dành cho phát lại âm thanh được tích hợp trong trình duyệt chứ không phải là một plugin trình duyệt.

    Thẻ âm thanh hiện hỗ trợ ba định dạng tệp OGG, MP3 và WAV có thể được thêm vào html của bạn như sau.

    Thêm OGG

      & lt; điều khiển âm thanh & gt;
      & lt; source src = "file.ogg" type = "audio / ogg" & gt;
    & lt; / audio & gt;  

    Thêm MP3

      & lt; điều khiển âm thanh & gt;
      & lt; source src = "file.mp3" type = "audio / mpeg" & gt;
    & lt; / audio & gt;  

    Thêm WAV

      & lt; điều khiển âm thanh & gt;
      & lt; source src = "file.wav" type = "audio / wav" & gt;
    & lt; / audio & gt;  

    Nó có thể chứa một hoặc nhiều nguồn âm thanh, được biểu diễn bằng thuộc tính src hoặc phần tử nguồn.

    Thêm Nhiều Tệp Âm thanh

      & lt; điều khiển âm thanh & gt;
      & lt; source src = "file-1.wav" type = "audio / wav" & gt;
      & lt; source src = "file-2.ogg" type = "audio / ogg" & gt;
      & lt; source src = "file-3.mp3" type = "audio / mpeg" & gt;
    & lt; / audio & gt;  

    Hỗ trợ của Trình duyệt cho các loại tệp khác nhau như sau

    Thuộc tính được hỗ trợ

    Phần tử iframe

    Phần tử HTML & lt; iframe & gt; đại diện cho một khung nội tuyến, cho phép bạn đưa một tài liệu HTML độc lập vào tài liệu HTML hiện tại. & lt; iframe & gt; thường được sử dụng để nhúng phương tiện của bên thứ ba, phương tiện của riêng bạn, tiện ích con, đoạn mã hoặc nhúng các ứng dụng của bên thứ ba, chẳng hạn như hình thức thanh toán.

    Thuộc tính

    Dưới đây là một số thuộc tính của & lt; iframe & gt; :

    Thẻ iframe được sử dụng để thêm một trang web hiện có trang hoặc ứng dụng đến trang web của bạn trong một không gian nhất định.

    Khi sử dụng thẻ iframe, thuộc tính src nên được sử dụng để chỉ ra vị trí của trang web hoặc ứng dụng để sử dụng trong khung.

    < pre> & lt; iframe src = "framesite / index.html" & gt; & lt; / iframe & gt;

    Bạn có thể đặt thuộc tính chiều rộng và chiều cao để giới hạn kích thước của khung.

      & lt; iframe src = "framesite / index.html" height = "500" width = "200" & gt; & lt ; / iframe & gt;  

    Iframe có đường viền theo mặc định, nếu bạn muốn loại bỏ điều này, bạn có thể làm như vậy bằng cách sử dụng thuộc tính style và đặt thuộc tính đường viền CSS thành không.

    < pre> & lt; iframe src = "framesite / index.html" height = "500" width = "200" style = "border: none;" & gt; & lt; / iframe & gt; < / pre>

    Ví dụ

    Nhúng video YouTube với & lt; iframe & gt; :

      & lt; iframe width = "560" height = "315" src = "https://www.youtube.com/embed/v8kFT4I31es"
    frameborder = "0" allowfullscreen & gt; & lt; / iframe & gt;  

    Nhúng Google Maps với & lt; iframe & gt; :

      & lt; iframe src = "https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d774386.2436462595!2d-74.53874786161381!3d40.69718109704434!2m3! 1f0! 2f0! 3f0! 3m2! 1i1024! 2i768! 4f13.1! 3m3! 1m2! 1s0x89c24fa5d33f083b% 3A0xc80b8f06e177fe62! 2sNew + York% 2C + NY% 2C + USA! 5e0! 3m2! 1424 "2sau!
    width = "600" height = "450" ​​frameborder = "0" style = "border: 0" allowfullscreen & gt; & lt; / iframe & gt;  

    Văn bản thay thế

    Nội dung giữa các thẻ & lt; iframe & gt; mở và đóng được sử dụng làm văn bản thay thế, sẽ được hiển thị nếu trình duyệt của người xem không hỗ trợ iframe.

      & lt; iframe width = "560" height = "315" src = "https://www.youtube.com/embed/v8kFT4I31es" frameborder = " 0 "& gt;
      & lt; p & gt; Trình duyệt của bạn không hỗ trợ iframe. & lt; / p & gt;
    & lt; / iframe & gt;  

    Bất kỳ phần tử neo nào cũng có thể nhắm mục tiêu nội dung của phần tử & lt; iframe & gt; . Thay vì chuyển hướng cửa sổ trình duyệt đến trang web được liên kết, nó sẽ chuyển hướng & lt; iframe & gt; . Để điều này hoạt động, thuộc tính target của phần tử & lt; a & gt; phải khớp với thuộc tính name của & lt; iframe & gt; .

      & lt; iframe width = "560" height = "315" src = "about: blank" frameborder = "0" name = " iframe-redir "& gt; & lt; / iframe & gt;

    & lt; p & gt; & lt; a href = "https://www.youtube.com/embed/v8kFT4I31es" target = "iframe-redir" & gt; Redirect Iframe & lt; / a & gt; & lt; / p & gt; < / pre>

    Ban đầu, ví dụ này sẽ hiển thị & lt; iframe & gt; trống, nhưng khi bạn nhấp vào liên kết ở trên, nó sẽ chuyển hướng & lt; iframe & gt; để hiển thị Video trên YouTube.

    JavaScript và iframe

    Tài liệu được nhúng trong mã & lt; iframe & gt; có thể chạy JavaScript trong ngữ cảnh của riêng chúng (mà không ảnh hưởng đến trang web mẹ) như bình thường.

    Mọi tương tác tập lệnh giữa trang web mẹ và nội dung của & lt; iframe & gt; được nhúng là tuân theo chính sách cùng xuất xứ. Điều này có nghĩa là nếu bạn tải nội dung của & lt; iframe & gt; từ một miền khác, trình duyệt sẽ chặn mọi nỗ lực truy cập nội dung đó bằng JavaScript.


Xem thêm những thông tin liên quan đến chủ đề thẻ html là gì

HTML - Giới thiệu một số thẻ ngữ nghĩa HTML5 và đa phương tiện

  • Tác giả: Thanh Duong Huu
  • Ngày đăng: 2021-07-15
  • Đánh giá: 4 ⭐ ( 7531 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: HTML cơ bản

HTML là gì? Nền tảng lập trình web cho người mới bắt đầu

  • Tác giả: wiki.matbao.net
  • Đánh giá: 3 ⭐ ( 4716 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: HTML là gì? HTML viết tắt của Hypertext Markup Language là ngôn ngữ lập trình dùng để xây dựng và cấu trúc lại các thành phần có trong website

HTML Là Gì? HTML CSS Và Kiến Thức Tổng Quan Bạn Cần Nắm Rõ

  • Tác giả: hostingviet.vn
  • Đánh giá: 5 ⭐ ( 7882 lượt đánh giá )
  • Khớp với kết quả tìm kiếm:

Thẻ HTML là gì? Tổng hợp các thẻ HTML thông dụng trong SEO

  • Tác giả: lagency.vn
  • Đánh giá: 3 ⭐ ( 4287 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Tổng hợp kiến thức thẻ HTML là gì, cấu trúc, vai trò và cách tối ưu từng loại thẻ HTML cơ bản thường gặp trong SEO sao cho hiệu quả nhất. Clikc xem ngay!

Thẻ HTML là gì? Danh sách các thẻ HTML trong thiết kế web

  • Tác giả: isinhvien.com
  • Đánh giá: 3 ⭐ ( 8203 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Bài viết này sẽ tổng hợp tất cả những kiến thức về thông tin và chức năng chi tiết của tất cả các thẻ HTML hiện nay đang được hỗ trợ để lập trình thiết kế web, giúp bạn có cái nhìn tổng quát hơn và hiểu sâu hơn về HTML trong thiết kế web.

Tag Thông Dụng trong HTML — HTML Cheat Sheet

  • Tác giả: www.stdio.vn
  • Đánh giá: 4 ⭐ ( 7790 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Liệt kê các loại thẻ (tag) thường dùng trong HTML để trình bày 1 trang web.

Thẻ Span Html Là Gì

  • Tác giả: detnhatrang.com.vn
  • Đánh giá: 4 ⭐ ( 4457 lượt đánh giá )
  • Khớp với kết quả tìm kiếm: Để xây dựng trang web, bạn nên biết về HTML - công nghệ cơ bản được sử dụng để xác định cấu trúc của một trang web, điều này đặc biệt quan trọng, HTML được sử dụng để chỉ định xem nội dung web của bạn có được nhận dạng là một đoạn văn, danh sách, tiêu đề, liên kết, hình ảnh, trình phát đa phương tiện, biểu mẫu hay một trong nhiều phần tử có sẵn khác hay thậm chí là một phần tử mới mà bạn xác định hay không

Xem thêm các bài viết khác thuộc chuyên mục: Kiến thức lập trình

Xem Thêm  Trình phát âm thanh tùy chỉnh HTML đơn giản (Ví dụ từng bước) - phát javascript html âm thanh

By ads_php