HTML5の記事タグ
この記事では、HTML5でarticleタグを使用する方法を学習するため、articleタグをいつ使用するかとsectionタグをいつ使用するかがわかります。
前回の投稿では、標準のHTML5テンプレートの構造を学びましたが、それを簡単に使用する方法を学びました。そのため、この記事では、html5で記事を宣言するもう少し詳しく説明します。各記事は記録であり、ヘッダーとフッターを含む部分として扱います。
HTML5で作成されたWebページの構造については説明しないため、この記事を読む前に、HTML5構造のレッスンを参照する必要があります。
1. HTML5のarticleタグとは何ですか？
ArticleはHTML5バージョンで追加されたHTMLタグであり、Webページに表示される記事の構造を宣言するために使用されます。
記事タグは、記事のリストや記事の詳細に関するページで使用されます。各記事内で、各記事のタイトルである他のヘッダータグを宣言することもできます。
<article></article>プロパティに関しては、articleタグはdivタグに似ています。つまり、コンテンツに応じて幅が100％、高さが100％のブロックを表示します。
2.HTML5記事をレイアウトに追加します
まず、以下のHTML5構造コードを参照してください。
<!doctype html> <html lang="vi"> <head> <meta charset="utf-8" /> <title>Chương Trình HTML Đầu Tiên</title> </head> <body> <header> <h1>HTML5 Cho Người Mới Bắt Đầu Tại web888.vn</h1> </header> <nav> <ul> <li><a href="#">Home</a></li> <li><a href="#">Serie</a></li> <li><a href="#">Tutorial</a></li> <li><a href="#">Ebook</a></li> </ul> </nav> <section> <article> <header> <hgroup> <h1>Trung Quốc vi phảm chủ quyền biển Việt Nam</h1> <h2>Bản Tin 24/7</h2> </hgroup> </header> <p>Trung quốc xâm phạm vùng biển thuộc chủ quyền việt nam một cách trắng trợn</p> <footer> <p>Tác giả: thehalfheart - Đăng ngày: 08-05-2014</p> </footer> </article> </section> <aside> <h3>Tuts HTML</h3> Học Lập Trình HTML5 </aside> <footer> Copyright 2014 By web888.vn </footer> </body> </html>このセクションでは、ヘッダーとナビゲーション、脇とフッターは前の投稿と同じですが、 section自体にはさらにいくつかのタグがあります。
<section> <article> <header> <hgroup> <h1>Trung Quốc vi phảm chủ quyền biển Việt Nam</h1> <h2>Bản Tin 24/7</h2> </hgroup> </header> <p>Trung quốc xâm phạm vùng biển thuộc chủ quyền việt nam một cách trắng trợn</p> <footer> <p>Tác giả: thehalfheart - Đăng ngày: 08-05-2014</p> </footer> </article> </section>このsectionでは、ニューステンプレートを表示したいので、 articleを作成しました。 articleには、タイトルを含むheader 、コンテンツを含むpタグ、作成者情報と投稿日を含むfooterタグがあります。ニュース。 headerには2つのタグh1とh2があるので、 hgroupタグを使用して囲みました。h1タグのみを使用する場合は、追加のh1タグを使用する必要はありません。
すべての記事、hgroup、ヘッダー、フッター、セクション、脇のタグはHTMl5タグであり、残りは通常のHTMLタグです。
2つのレコードのリストがある場合はどうなりますか？非常に簡単です。記事タグを2にコピーするだけです。
<section> <article> <header> <hgroup> <h1>Trung Quốc vi phảm chủ quyền biển Việt Nam</h1> <h2>Bản Tin 24/7</h2> </hgroup> </header> <p>Trung quốc xâm phạm vùng biển thuộc chủ quyền việt nam một cách trắng trợn</p> <footer> <p>Tác giả: thehalfheart - Đăng ngày: 08-05-2014</p> </footer> </article> <article> <header> <hgroup> <h1>Trung Quốc vi phảm chủ quyền biển Việt Nam</h1> <h2>Bản Tin 24/7</h2> </hgroup> </header> <p>Trung quốc xâm phạm vùng biển thuộc chủ quyền việt nam một cách trắng trợn</p> <footer> <p>Tác giả: thehalfheart - Đăng ngày: 08-05-2014</p> </footer> </article> </section>3.結論
この記事から、ヘッダータグとフッタータグはメインレイアウト用であるだけでなく、記事タグ内で使用できることがわかります。ヘッダーには、ヘッダーをグループ化するためのhtml5hgroupタグがあります。そしてもちろん、これらのタグの使用はオプションです。つまり、記事でヘッダータグを使用する代わりに、divタグまたは別の通常のタグを使用できます。
Bài viết liên quan:
Dịch vụ thiết kế Wesbite
