dt要素・dtタグとは

定義リスト・用語リストを表現する dt要素

自分はブロック要素かインライン要素かブロック要素
含むことができる要素型インライン要素のみ
名称の由来dt は definition term (定義の用語) を省略したもの

定義リストの用語として利用されるdt要素は、dl要素・dd要素と共に利用される。

table要素を使うか、dl・dt・dd要素を使うか迷った場合は、文章構造の観点から考えると良い。

HTML
<dl>
	<dt>id</dt>
	<dd>要素に名前を付ける。文章中で重複しないこと</dd>
	<dt>class</dt>
	<dd>要素に1つ、または複数の名前を付ける。文章中で重複しても良い</dd>
</dl>

含むことができる要素について

dt要素は内部にインライン要素のみを含むことができる。ブロック要素を含むことは文法的に正しくないので注意が必要である。
※共に利用されるdd要素は内部にインライン要素・ブロック要素の両方を含むことができる。

見た目の調整について

前述したとおり、dd要素はインライン・ブロック要素を含むことが可能で汎用性が高い。そのためスタイルシートと組み合わせてdl・dt・ddを利用し独自の表のような表現も可能である。

近年のWEBサイトにおいて、dl要素は見出し的な使われ方をする事が多い。
cssの font-sizeプロパティやfont-weightプロパティ、colorプロパティを適用することでユーザに対し効果的な表示を行うことができる。

コメントを残す

メールアドレスが公開されることはありません。