Các phần tử HTML ngữ nghĩa là những phần tử mô tả rõ ràng ý nghĩa của chúng theo cách mà con người và máy có thể đọc được Các phần tử như <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1, <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2 và <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
3 đều được coi là có ngữ nghĩa vì chúng mô tả chính xác mục đích của phần tử và loại nội dung bên trong chúngCác yếu tố ngữ nghĩa là gì?HTML ban đầu được tạo ra như một ngôn ngữ đánh dấu để mô tả các tài liệu trên internet sơ khai. Khi internet phát triển và được nhiều người sử dụng hơn, nhu cầu của nó đã thay đổi Nơi mà internet ban đầu được dùng để chia sẻ tài liệu khoa học, bây giờ người ta muốn chia sẻ cả những thứ khác nữa. Rất nhanh chóng, mọi người bắt đầu muốn làm cho web trông đẹp hơn Bởi vì web ban đầu không được xây dựng để thiết kế, các lập trình viên đã sử dụng các cách hack khác nhau để sắp xếp mọi thứ theo những cách khác nhau. Thay vì sử dụng <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
4 để mô tả thông tin bằng bảng, các lập trình viên sẽ sử dụng chúng để định vị các thành phần khác trên trangKhi việc sử dụng các bố cục được thiết kế trực quan phát triển, các lập trình viên bắt đầu sử dụng một thẻ "phi ngữ nghĩa" chung chung như <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
5. Họ thường gán cho những yếu tố này thuộc tính <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
6 hoặc <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
7 để mô tả mục đích của chúng. Ví dụ, thay vì <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1, điều này thường được viết là <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
9Vì HTML5 vẫn còn tương đối mới nên việc sử dụng các phần tử phi ngữ nghĩa này vẫn còn rất phổ biến trên các trang web ngày nay Danh sách các yếu tố ngữ nghĩa mớiCác phần tử ngữ nghĩa được thêm vào trong HTML5 là <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
3<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
2<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
3<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
4<div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2<div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
7<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
8<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
9<header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
0<header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
1<header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
2
Các phần tử như <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1, <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
9, <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
0, <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
3, <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1 và <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2 ít nhiều hành động giống như các phần tử <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
5. Chúng nhóm các phần tử khác lại với nhau thành các phần của trang. Tuy nhiên, trong trường hợp thẻ <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
5 có thể chứa bất kỳ loại thông tin nào, thì có thể dễ dàng xác định loại thông tin nào sẽ đi vào vùng <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1 ngữ nghĩaMột ví dụ về bố cục phần tử ngữ nghĩa của w3schools Tại sao sử dụng các yếu tố ngữ nghĩa?Để xem xét lợi ích của các yếu tố ngữ nghĩa, đây là hai đoạn mã HTML. Khối mã đầu tiên này sử dụng các yếu tố ngữ nghĩa <header></header>
<section>
<article>
<figure>
<img>
<figcaption></figcaption>
</figure>
</article>
</section>
<footer></footer>
Trong khi khối mã thứ hai này sử dụng các phần tử phi ngữ nghĩa <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
Đầu tiên, nó dễ đọc hơn nhiều. Đây có lẽ là điều đầu tiên bạn sẽ nhận thấy khi nhìn vào khối mã đầu tiên sử dụng các phần tử ngữ nghĩa. Đây là một ví dụ nhỏ, nhưng là một lập trình viên, bạn có thể đọc qua hàng trăm, hàng nghìn dòng mã. Mã đó càng dễ đọc và hiểu thì công việc của bạn càng dễ dàng Nó có khả năng tiếp cận lớn hơn. Bạn không phải là người duy nhất thấy các yếu tố ngữ nghĩa dễ hiểu hơn. Công cụ tìm kiếm và công nghệ hỗ trợ (như trình đọc màn hình dành cho người dùng khiếm thị) cũng có thể hiểu rõ hơn về ngữ cảnh và nội dung trang web của bạn, nghĩa là mang lại trải nghiệm tốt hơn cho người dùng của bạn Nhìn chung, các yếu tố ngữ nghĩa cũng dẫn đến mã nhất quán hơn. Khi tạo tiêu đề bằng các phần tử phi ngữ nghĩa, các lập trình viên khác nhau có thể viết phần này là <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
9, <hgroup>
<h1>Heading 1</h1>
<h2>Subheading 1</h2>
<h2>Subheading 2</h2>
</hgroup>
3, <hgroup>
<h1>Heading 1</h1>
<h2>Subheading 1</h2>
<h2>Subheading 2</h2>
</hgroup>
4 hoặc đơn giản là <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
5. Có rất nhiều cách để bạn có thể tạo phần tử tiêu đề và tất cả chúng đều phụ thuộc vào sở thích cá nhân của người lập trình. Bằng cách tạo một yếu tố ngữ nghĩa tiêu chuẩn, nó giúp mọi người dễ dàng hơnKể từ tháng 10 năm 2014, HTML4 đã được nâng cấp lên HTML5, cùng với một số yếu tố “ngữ nghĩa” mới. Cho đến ngày nay, một số người trong chúng ta vẫn có thể bối rối không hiểu tại sao có quá nhiều yếu tố khác nhau mà dường như không có bất kỳ thay đổi lớn nào. <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
0 và <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
3
“Sự khác biệt là gì?”, bạn có thể hỏi. Cả hai yếu tố này đều được sử dụng để phân chia nội dung và vâng, chúng chắc chắn có thể được sử dụng thay thế cho nhau. Đó là vấn đề trong hoàn cảnh nào. HTML4 chỉ cung cấp một loại phần tử vùng chứa, đó là <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
5. Mặc dù điều này vẫn được sử dụng trong HTML5, nhưng HTML5 đã cung cấp cho chúng tôi <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
0 và <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
3 theo cách để thay thế <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
5Các phần tử <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
0 và <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
3 giống nhau về mặt khái niệm và có thể hoán đổi cho nhau. Để quyết định bạn nên chọn cái nào trong số này, hãy lưu ý những điều sau- Một bài báo được dự định để phân phối độc lập hoặc tái sử dụng
- Một phần là một nhóm nội dung theo chủ đề
<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
<div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1 và <aside>
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
</aside>
5
Phần tử <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1 thường được tìm thấy ở đầu tài liệu, phần hoặc bài báo và thường chứa tiêu đề chính và một số công cụ điều hướng và tìm kiếm<header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
Phần tử <aside>
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
</aside>
5 nên được sử dụng khi bạn muốn có một tiêu đề chính với một hoặc nhiều tiêu đề phụ<hgroup>
<h1>Heading 1</h1>
<h2>Subheading 1</h2>
<h2>Subheading 2</h2>
</hgroup>
HÃY NHỚ rằng phần tử <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1 có thể chứa bất kỳ nội dung nào, nhưng phần tử <aside>
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
</aside>
5 chỉ có thể chứa các tiêu đề khác, đó là <nav>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
</nav>
0 đến <nav>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
</nav>
1 và bao gồm cả <aside>
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
</aside>
5<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1
Phần tử <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1 dành cho nội dung không phải là một phần của dòng văn bản mà nó xuất hiện, tuy nhiên vẫn có liên quan theo một cách nào đó. Điều này của <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1 như một thanh bên cho nội dung chính của bạn<aside>
<p>This is a sidebar, for example a terminology definition or a short background to a historical figure.</p>
</aside>
Trước HTML5, các menu của chúng tôi được tạo bằng <nav>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
</nav>
6 và <nav>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
</nav>
7. Bây giờ, cùng với những thứ này, chúng tôi có thể tách các mục menu của mình bằng một <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
9, để điều hướng giữa các trang của bạn. Bạn có thể có bất kỳ số lượng <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
9 phần tử nào trên một trang, ví dụ: thông thường có điều hướng toàn cầu trên đầu trang (trong <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1) và điều hướng cục bộ trong thanh bên (trong phần tử <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1)<nav>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
</nav>
<div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2
Nếu có một <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1 thì phải có một <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2. Một <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2 thường được tìm thấy ở cuối tài liệu, một phần hoặc một bài viết. Cũng giống như <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
1, nội dung nói chung là siêu thông tin, chẳng hạn như thông tin chi tiết về tác giả, thông tin pháp lý và/hoặc liên kết đến thông tin liên quan. Cũng hợp lệ khi bao gồm các phần tử <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
0 trong phần chân trang<footer>©Company A</footer>
<footer>©Company A</footer>
8
Phần tử <footer>©Company A</footer>
8 thường xuất hiện trong phần tử <div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
2 hoặc <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
1 thường chứa thông tin bản quyền hoặc tuyên bố từ chối trách nhiệm pháp lý và các bản in đẹp như vậy. Tuy nhiên, điều này không nhằm mục đích làm cho văn bản nhỏ hơn. Nó chỉ mô tả nội dung của nó, không quy định cách trình bày<footer><small>©Company A</small> Date</footer>
<header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
2
Phần tử <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
2 cho phép đính kèm một ngày rõ ràng theo tiêu chuẩn ISO 8601 vào một phiên bản mà con người có thể đọc được của ngày đó<time datetime="2017-10-31T11:21:00+02:00">Tuesday, 31 October 2017</time>
Tại sao phải bận tâm với <header>
<h1>Company A</h1>
<ul>
<li><a href="/home">Home</a></li>
<li><a href="/about">About</a></li>
<li><a href="/contact">Contact us</a></li>
</ul>
<form target="/search">
<input name="q" type="search" />
<input type="submit" />
</form>
</header>
2? <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
4 và <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
3
<section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
4 là để bọc nội dung hình ảnh của bạn xung quanh nó và <section>
<p>Top Stories</p>
<section>
<p>News</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
<section>
<p>Sport</p>
<article>Story 1</article>
<article>Story 2</article>
<article>Story 3</article>
</section>
</section>
3 là để chú thích cho hình ảnh của bạn<div id="header"></div>
<div class="section">
<div class="article">
<div class="figure">
<img>
<div class="figcaption"></div>
</div>
</div>
</div>
<div id="footer"></div>
0Tìm hiểu thêm về các phần tử HTML5 mới- w3schools cung cấp các mô tả đơn giản và rõ ràng về nhiều yếu tố tin tức và cách thức/nơi chúng nên được sử dụng
- MDN cũng cung cấp một tài liệu tham khảo tuyệt vời cho tất cả các phần tử HTML và đi sâu hơn vào từng phần tử.
QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO QUẢNG CÁO
Nếu bài viết này hữu ích, hãy tweet nó Học cách viết mã miễn phí. Chương trình giảng dạy nguồn mở của freeCodeCamp đã giúp hơn 40.000 người có việc làm với tư cách là nhà phát triển. Bắt đầu
Các thẻ có sẵn trong HTML5 là gì?
Hoàn thành khóa học HTML/CSS 2022
. Chỉ định một phần nội dung chỉ liên quan một chút đến phần còn lại của trang. New Tag:Specifies a piece of content that is only slightly related to the rest of the page. Thẻ mới. Chỉ định một tệp âm thanh. Thẻ mới. Điều này được sử dụng để hiển thị đồ họa bitmap động một cách nhanh chóng, chẳng hạn như đồ thị hoặc trò chơi. Thẻ mới. Chỉ định một lệnh mà người dùng có thể gọi.
Cái nào sau đây không phải là một thẻ hợp lệ trong HTML5?
Một số thuộc tính từ HTML4 hoàn toàn không được phép sử dụng trong HTML5 và chúng đã bị xóa hoàn toàn. img và iframe . Chú thích, iframe, img, đầu vào, đối tượng, huyền thoại, bảng, hr, div, H1, H2, H3, H4, H5, H6, P, Col, colgroup, tbody, Td, tfoot, th, thead và tr. bảng, tr, td, th và nội dung.
Thẻ nào sau đây xác định rằng tài liệu là tài liệu HTML5?
DOCTYPE html> là bắt buộc đối với HTML5 và phải luôn là thẻ đầu tiên trong tài liệu HTML của bạn.
Cái nào sau đây là một thẻ mới trong HTML5?
| 
