改行、文字の飾りつけ,箇条書き

Web ページを華やかに表現するためのタグが幾つかあります。

全て覚える必要はありません。利用しながら必要なときに覚えていきましょう。

【注意】
「HTML」の規格を策定している World Wide Web Consortium（W3C）によると、「HTML5」ではbig要素、strike要素は廃止予定です。


要素    説明                           代価方法
big      フォントを大きく表示            スタイルシート
strike   テキストに取消線を引く          del、s

要素	説明	代価方法
big	フォントを大きく表示	スタイルシート
strike	テキストに取消線を引く	del、s

文書の体裁を整えるためのタグ

「HTML文書を書き直そう」でも幾つか新しいタグが出てきましたが、文書を華やかに表現する上で便利なタグがあるので紹介します。

`<hr>`	罫線をレンダリングする
`<p>～</p>`	1つの段落を表す
`<br>`	現在のテキスト行を強制的に区切る(改行する)
`<address>～</address>`	文書の主要部分に関する問い合せ先を示す

長い文書を記述する場合、改行を挿入したり、段落を変えたいことがあると思います。

その時、上記のようなタグを用いれば、文書の体裁を整えることが可能です。文書の体裁を整えるためのタグ

なお、1つの段落を表す<p>タグは、「終了タグ」は省略可能です。

文字の飾りつけを行うタグ

文字の飾りつけのを行う「物理的なタグ」としては以下のようなものがあります。

`<b>～</b>`	ボールド体（太字）でレンダリング
`<i>～</i>`	イタリック体（斜体）でレンダリング
`<s>～</s><strike>～</strike>`	取り消し線を引いてレンダリング
`<u>～</u>`	下線を引いてレンダリング

また、文字の飾りつけのを行う「論理的なタグ」としては以下のようなものがあります。

`<strong>～<strong>`	より強い強調（最強調）を示す
`<em>～<em>`	強調を示す

この、「物理的なタグ」とは、「太字」「斜体」のように直接的な意味を持つものです。一方、「論理的なタグ」とは、「強調」「最強調」のという意味的な意味を持つものです。

実際に利用した文字の形は次の図のようになります。

多くのブラウザでは「強調」「最強調」の意味として、「太字」「斜体」で表現していますが、文字を大きくしたり、下線を引いたりして「強調」を表現するブラウザも存在する可能性があります。

ただ、「物理的なタグ」は、ウェブアクセシビリティを考慮し推奨されていないため、最近は利用されていません。

【注意】
加えて「HTML」の規格を策定している World Wide Web Consortium（W3C）によると、「文字の飾りつけを行う物理的なタグ」は廃止予定タグに
なっています。これらのタグはスタイルシートで代価することが推奨されています。

箇条書き（リスト）を指定するタグ

「箇条書き」を指定するタグについて説明します。これは、順序立てて説明を行う場合に便利です。

<ul>
<li> 項目A </li>
<li> 項目B </li>
<li> 項目C </li>
<li> 項目D </li>
<li> 項目E </li>
:　　　:
<li> 項目Z </li>
</ul>

まず、箇条書きにすることを指定する<ul>
を書きます。
次に、箇条書きの項目の先頭に<li>を
つけます。
これで、テキストが字下げされ、
先頭に「」がつきます。

もし<ul>を
<ol>へ変えると「」が「アラビア数字」へ
変化します。
<ul>は Unordered List の略です。

「箇条書き」したい時、このタグを用いれば体裁にこだわる必要なく、自動で体裁が決まります。なお、リスト項目を定める<li> の終了タグは省略可能です。

「」や「アラビア数字」よる箇条書き以外に、「type属性」を与える事で次のようなスタイルにもできます。

type属性値	番号付けスタイル
disc	塗りつぶした小さい円	、、、…
circle	小さく丸い枠	、、、…
square	小さく四角い枠	、、、…
1	アラビア数字	1、2、3、…
a	アルファベット小文字	a、b、c、…
A	アルファベット大文字	A、B、C、…
i	ローマ数字小文字	i、ii、iii、…
I	ローマ数字大文字	I、II、III、….

これは、<ul type="type属性">～</ul>の形で利用できます。

【注意】
「HTML」の規格を策定している World Wide Web Consortium（W3C）によると、type属性は推奨さていません。
リストスタイルはスタイルシートで制御することが推奨されています。

「上つき文字」「下つき文字」「ルビ」などの指定

「数式」を記述する場合や、フランス語などでは適切なレンダリングのために「上つき文字」や「下つき文字」が必要です。これには次のタグを使用します。

`<sup>～</sup>`	上つき文字
`<sub>～</sub>`	下つき文字

また、子供向けコンテンツなどでは、難しい漢字には「ルビ」をふりたい人もいるかもしれません。これには次のタグを使用します。

`<ruby>～</ruby>`	ルビをふる
`<rp>～</rp>`	未対応ブラウザのための括弧（Ruby Parentheses）を指定
`<rt>～</rt>`	ルビ文字列（Ruby Text）を指定

上記のような表現がしたい場合は、以下のような書き方をします。

上付き文字　Y=2X<sup>2</sup>+3X

下付き文字　T<sub>E</sub>X

<ruby>鶯<rp>（</rp><rt>うぐいす</rt><rp>）</rp></ruby>

実際に、ブラウザに表示すると次のようになります。文字の飾りつけ

なお、<ruby>タグが対応していないブラウザでは、「鶯（うぐいす）」と表示されます。

【注意】
この<ruby>タグは日本から W3C に提案されて審議されていたものです。仕様自体は 2001年5月31日に XHTMLモジュール定義「Ruby Annotation」としてW3C勧告になっています。

改行、文字の飾りつけ,箇条書き