ばけらの HTML リファレンス(未完成)

bakera.jp > 鳩丸リファレンス > ばけらの HTML リファレンス(未完成) > 要素一覧 > p要素

p要素

要素名バージョン開始タグ終了タグ分類/親中身
p2.0, 2.x, 3.2, 4.0, X1.0, X1.1必須省略可%block;%inline;
属性名バージョン属性値既定値備考
align3.2, (4.0), (X1.0)(left|center|right|justify)#IMPLIEDdefault is left for ltr paragraphs, right for rtl

共通属性 …… %coreattrs;, %i18n;, %events;

pの解説

P は Paragraph の頭文字で、文字通り段落を表す要素です。<p> と </p> で囲んだ部分が段落となります。

align属性で右寄せやセンタリングが可能ですが、HTML4 ではこの属性は非推奨です。スタイルシートを使いましょう。ちなみに、既定値は書字方向が ltr (左から右) の場合には left、rtl では right となります。

要素の中身がインライン要素となっている点に注意して下さい。p 自身はブロック要素ですが、中身にブロック要素を含むことはできません。次の例は昔よく見かけた間違いです。

<p align=right>
<hr>
</p>

作者の意図は hrを右寄せすることにあるのでしょうが、hr はブロック要素であるため、 p の中に入れることはできません。この場合、<hr> の直前に </p> が補われて以下のように解釈されます。

<p align=right>
</p>
<hr>
</p>

当然、右寄せにはなりません。中身が空の p要素は無視される (多くのブラウザは手抜き実装で一行空きにしてしまいますが、本来は無視されるべきものです) だけですが、hrの後ろにある </p> を解釈できません。よって不正となります。このようなマーク付けをしてはいけません。

同様に、tablepre, blockquote なども p の中に入れることができません。p で table をセンタリングできてしまうブラウザも存在するようですが、それは正しい位置に </p> を補うことができていないということです。つまりブラウザのバグです。

最近の日記

関わった本など

インクルーシブHTML+CSS & JavaScript 多様なユーザーニーズに応えるフロントエンドデザインパターンデザイニングWebアクセシビリティ - アクセシブルな設計やコンテンツ制作のアプローチコーディングWebアクセシビリティ - WAI-ARIAで実現するマルチデバイス環境のWebアプリケーション体系的に学ぶ 安全なWebアプリケーションの作り方 脆弱性が生まれる原理と対策の実践ウェブの仕事力が上がる標準ガイドブック 5 WebプログラミングWeb Site Expert #13Dreamweaver プロフェッショナル・スタイル [CS3対応] (Style for professional)友井町バスターズ (富士見ファンタジア文庫)

その他サイト