ITを学ぶなら
｢テックプロジン｣

Developer

footer要素
2020.11.03
Lv1

footer要素

hiraoka

footer

footer要素は各セクションのフッター情報を表します。
body要素やarticle要素内で用いられ、著者・関連文書へのリンク・著作権情報などが含まれます。
article要素に含まれない場合は、body要素（ページ全体）のフッター情報を示すことになります。

カテゴリー

フロー・コンテンツ
パルパブル・コンテンツ

footer属性

固有の属性はありません。

footer使用例

footer使用例(複数設置する例)
<!DOCTYPE html>
<html lang="ja">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Javascript | tech.pjin.jp</title>
	</head>
	<body>
		<header class="page-header">
			<h1>Javascript</h1>
			<p>初心者から始める、簡単なプログラム言語</p>
		</header>
		<main class="container">
			<article id="A498123">
				<header class="art-header">
					<h2>if文</h2>
					<p>簡単な条件分岐</p>
				</header>
				<section>
					<p>if文は条件分岐を行います。</p>
					<p>if(条件式)という記述で記載します。</p>
				</section>
				<footer>
					<address>
						この記事に関するお問い合わせ
						<a href="mailto:teacher@ssie.jp">teacher@ssie.jp</a>
					</address>
				</footer>
			</article>
		</main>
	</body>
</html>
footer使用例(親子構造で設置する例)
<!DOCTYPE html>
<html lang="ja">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>PHP | tech.pjin.jp</title>
	</head>
	<body>
		<header class="page-header">
			<h1>PHP</h1>
			<p>初心者から始める、簡単なプログラム言語</p>
		</header>
		<main class="container">
			<article id="A498123">
				<header class="art-header">
					<h2>if文</h2>
					<p>簡単な条件分岐</p>
				</header>
				<section>
					<p>if文は条件分岐を行います。</p>
					<p>if(条件式)という記述で記載します。</p>
					<p>Javascriptと同じですね。ちなみに、JavaもC#も一緒です。</p>
				</section>
			</article>
		</main>
		<fooder>
			<address>
				このサイトに関するお問い合わせ
				<a href="mailto:teacher@ssie.jp">teacher@ssie.jp</a>
			</address>
		</fodder>
	</body>
</html>
header要素
main要素
一覧へ戻る