article
article要素は、コンテンツ内で独立したセクションを表します。
article要素で囲まれた内容は、それ単体で切り出した際に意味が成立するものでないといけません。
以下の様なものが該当します。
・フォーラムへの投稿
・雑誌や新聞の記事
・ブログのエントリ
・ユーザーが投稿したコメント
また、article要素はコンテンツ内で複数設置することができ、
それ自体を親子構造にすることも可能です。
親子にした場合、子要素は親要素に関連した内容である必要があります。
カテゴリー
フローコンテンツ
セクショニングコンテンツ
パルパブルコンテンツ
article属性
固有の属性はありません。
article使用例
article使用例(複数設置する例)
[html highlight=”9-16″]
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>TOP | tech.pjin.jp</title>
<base href="https://tech.pjin.jp/">
</head>
<body>
<article>
<h1>ブログ始めました。</h1>
<p>ブログ始めました。日常で感じた色んなことココに…</p>
</article>
<article>
<h1>気になっていた近所のラーメン屋</h1>
<p>前々から気なっていた近所のラーメン屋。ブログのネタとして…</p>
</article>
</body>
</html>
[/html]
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>TOP | tech.pjin.jp</title>
<base href="https://tech.pjin.jp/">
</head>
<body>
<article>
<h1>ブログ始めました。</h1>
<p>ブログ始めました。日常で感じた色んなことココに…</p>
</article>
<article>
<h1>気になっていた近所のラーメン屋</h1>
<p>前々から気なっていた近所のラーメン屋。ブログのネタとして…</p>
</article>
</body>
</html>
[/html]
article使用例(親子構造で設置する例)
[html highlight=”9-21″]
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>TOP | tech.pjin.jp</title>
<base href="https://tech.pjin.jp/">
</head>
<body>
<article>
<h1>気になっていた近所のラーメン屋</h1>
<p>
前々から気なっていた近所のラーメン屋。<br>
ブログのネタとして行ってみることにしました！！…
</p>
<article>
<h3>コメント</h3>
<p>
私も気になっていたお店です！今度行って…
</p>
</article>
</article>
</body>
</html>
[/html]
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>TOP | tech.pjin.jp</title>
<base href="https://tech.pjin.jp/">
</head>
<body>
<article>
<h1>気になっていた近所のラーメン屋</h1>
<p>
前々から気なっていた近所のラーメン屋。<br>
ブログのネタとして行ってみることにしました！！…
</p>
<article>
<h3>コメント</h3>
<p>
私も気になっていたお店です！今度行って…
</p>
</article>
</article>
</body>
</html>
[/html]
