17.3.5 その他のよく使う要素

ここまで説明した要素の他によく使われる要素として強調,改行,引用,奥付,罫線があります.これらの使い方を説明します.

文字の強調

HTML 文書で単語を強調するときは,em 要素と strong 要素を使います.

ソース

僕は<em>F1</em>が好きだが,特に<strong>フェラーリ</strong>のファンである.

出力

僕はF1が好きだが,特にフェラーリのファンである.

どちらも強調を表すことには変わりはありませんが,strong 要素のほうがより強調の度合いが強くなります.大体のウェブブラウザでは標準的に em 要素を斜体で,strong 要素を太字で表すようですが,特に決まりはありません.

改行 (break line)

ウェブブラウザはソース中の改行をただの空白として扱い,表示する文書を自動で改行します.たとえば次の例を見ても,ソースの改行は表示結果に反映されていません.

ソース

ここで 改行

出力

ここで 改行

強制的に改行させたい場所があるときは,その位置に br 要素を書きます.

ソース

ここで<br>改行

出力

ここで
改行

br 要素は特に内容を持たない要素(空要素)なので,終了タグは書いてはいけません.なお,空白を空けるためだけに br 要素を用いるべきではないとされています.規則的に複数行の空白を空けたい場合は,次節 hwb17.4 CSS の書き方 で説明する CSS を用いてください.

引用

HTML 文書中で他の人の書いた文章を引用するために,q 要素と blockquote 要素が用意されています.q 要素は短い文章を引用するためのインライン要素で,自分の書いた文の中に引用文を埋め込む場合に使います.たとえば次のような使い方をします.

ソース

『共産党宣言』の冒頭でマルクスは<q>今日までのあらゆる社会の歴史は,階級闘争の歴史である</q>と述べている.

出力

『共産党宣言』の冒頭でマルクスは今日までのあらゆる社会の歴史は,階級闘争の歴史であると述べている.

一方,まとまった文章を引用するときは blockquote 要素を用います.

ソース

<blockquote>公共的サービスがこのような否定的な態度で見られているのにたいして,私的に生産される物はそうした態度で見られていない. それどころか,近代的な宣伝によってうるさいほど賞賛されている.それらは社会の終局的な富だとされて いる.公共的サービスと私的なサービス との競争は,それらがもたらす満足の問題を別にすれば,明らかに平等な競争ではない.この差別―私的な物を尊重し, 公共的なものを劣等視する この傾向―の社会的影響は大きく,また深刻であるとさえ言えよう. <cite>ガルブレイス『ゆたかな社会』</cite></blockquote>

出力

公共的サービスがこのような否定的な態度で見られているのにたいして,私的に生産される物はそうした態度で見られていない. それどころか,近代的な宣伝によってうるさいほど賞賛されている.それらは社会の終局的な富だとされて いる.公共的サービスと私的なサービス との競争は,それらがもたらす満足の問題を別にすれば,明らかに平等な競争ではない.この差別―私的な物を尊重し, 公共的なものを劣等視する この傾向―の社会的影響は大きく,また深刻であるとさえ言えよう. ガルブレイス『ゆたかな社会』

一般に blockquote 要素はいくらか字下げして表示されますが,この字下げ幅は後に述べる CSS を用いると自由に変えることができます.また上の例でも使いましたが, 引用した文献を明示するには cite 要素を用います.

奥付

文書の奥付を書くために,HTML では address 要素が用意されています.奥付には著作名,連絡先,文書の作成日時などを書きます.

ソース

<address> (c) はいぱーワークブックプロジェクト<br> 〒153-8902 東京都目黒区駒場 3-8-1<br> 最終更新日時 2008 年 3 月 31 日 </address>

出力

(c) はいぱーワークブックプロジェクト
〒153-8902 東京都目黒区駒場 3-8-1
最終更新日時 2008 年 3 月 31 日

罫線

罫線は hr 要素によって表します.<hr> と書いた位置に,次のような罫線が入ります.

ソース

<hr>

出力


hr 要素も空要素なので,終了タグは書きません.罫線の上下の余白はウェブブラウザに依存します.太さや色などは CSS を用いて指定することができます.