WEBページ作成リファレンス
cman.jp cman.jp > WEBページ作成TOP > HTMLタグ・リファレンス > HTMLタグ一覧(ABC順) > <dt>「記述・説明リストの見出し」

<dt> 「記述・説明リストの見出し」[読み方:ディーティー]

<dt>タグは、説明文リストの見出しを表します。<dt>は<dl>内に配置し、<dd>タグで説明文記載します。
説明文の説明部分に該当し、一般的なブラウザではインデントされて表示されます。

HTML規格HTML4.01HTML5
使用可否
広告

<dt> の仕様

カテゴリー使用できる場所(親要素)コンテンツモデル(子要素)タグ省略
<dl>内で
<dt>、<dd>の前
フローコンテンツ
但し、ヘディングコンテンツ、セクショニングコンテンツ、<header><footer>は不可
直後が<dt>、<dd>の場合、終了タグ省略可

<dt> の属性

【構文】
<dl>
<dt>~見出し部~</dt>
<dd>~説明部~</dd>
<dt>~見出し部~</dt>
<dd>~説明部~</dd>
・・・
</dl>
属性意味値のサンプルなど
---
グローバル属性
  • accesskey
  • autocapitalize
  • autofocus
  • class
  • contenteditable
  • dir
  • draggable
  • enterkeyhint
  • hidden
  • id
  • inert
  • inputmode
  • is
  • itemid
  • itemprop
  • itemref
  • itemscope
  • itemtype
  • lang
  • nonce
  • popover
  • slot
  • spellcheck
  • style
  • tabindex
  • title
  • translate
  • writingsuggestions
イベント属性
ページTOP

<dt>タグのサンプル

<dl>
<dt>HTMLタグ</dt>
<dd>ホームページを記述するための言語です。</dd>
<dt>JavaScript</dt>
<dd>ホームページの動作を記述するためのスクリプト言語です。</dd>
<dt>StyleSheet(CSS)</dt>
<dd>ホームページの見た目(色や線、配置など)を記述するための言語です。</dd>
</dl>
HTMLタグ
ホームページを記述するための言語です。
JavaScript
ホームページの動作を記述するためのスクリプト言語です。
StyleSheet(CSS)
ホームページの見た目(色や線、配置など)を記述するための言語です。
ページTOP

<dt>タグのスタイルシートサンプル

見出しを装飾する場合
<head>
<style type="text/css">
<!--
#css-s1 dt {
paddin-left: 18px;
font-weight: bold;
color: #4A78BF;
background-image : url(mark.png);
background-position: center left;
background-repeat: no-repeat;
}
-->
</style>
</head>

<div id="css-s1">
<dl>
<dt>HTMLタグ</dt>
<dd>ホームページを記述するための言語です。</dd>
<dt>JavaScript</dt>
<dd>ホームページの動作を記述するためのスクリプト言語です。</dd>
<dt>StyleSheet(CSS)</dt>
<dd>ホームページの見た目(色や線、配置など)を記述するための言語です。</dd>
</dl>
</div>
HTMLタグ
ホームページを記述するための言語です。
JavaScript
ホームページの動作を記述するためのスクリプト言語です。
StyleSheet(CSS)
ホームページの見た目(色や線、配置など)を記述するための言語です。

見出しと内容を横に並べる場合
<head>
<style type="text/css">
<!--
#css-s2 dl {
margin: 0;padding: 0;zoom: 100%;
}
#css-s2 dt {
float: left;margin: 0;font-weight: bold;
width: 170px;padding: 10px 0 10px 0;color: #4A78BF;
}
#css-s2 dd {
margin: 0;padding: 10px 15px 10px 120px;
border-bottom: 1px dotted #DDDDDD;
}
-->
</style>
</head>

<div id="css-s2">
<dl>
<dt>HTMLタグ</dt>
<dd>ホームページを記述するための言語です。</dd>
<dt>JavaScript</dt>
<dd>ホームページの動作を記述するためのスクリプト言語です。</dd>
<dt>StyleSheet(CSS)</dt>
<dd>ホームページの見た目(色や線、配置など)を記述するための言語です。</dd>
</dl>
</div>
HTMLタグ
ホームページを記述するための言語です。
JavaScript
ホームページの動作を記述するためのスクリプト言語です。
StyleSheet(CSS)
ホームページの見た目(色や線、配置など)を記述するための言語です。
ページTOP

留意事項

  • <dt>タグは<dl>タグ内に配置し、<dd>タグで説明文を含む必要があります。
ページTOP
広告
QrCode
このページのURL
スマートフォン・タブレット運営 : CMAN 株式会社シーマン