パーツ番号 02-05-10 ・ CSSのみ

区切り線付き定義リスト

用語とその説明がペアになった定義リストです。専門用語の解説や用語集ページの構成に活用できます。

staticcss

プレビュー

ソースコード

HTML

<dl class="d02-05-10-list">
          <dt>CMS</dt>
          <dd>記事や画像を管理するためのシステム</dd>
          <dt>SEO</dt>
          <dd>検索結果での表示順位を高める施策</dd>
        </dl>

CSS

.d02-05-10-list{margin:0;padding:0;width:100%;max-width:280px;font-size:13px;color:#333;}
        .d02-05-10-list dt{font-weight:bold;color:#222;padding-top:8px;border-top:1px solid #e0e0e0;}
        .d02-05-10-list dt:first-child{border-top:none;padding-top:0;}
        .d02-05-10-list dd{margin:2px 0 0;color:#777;padding-bottom:8px;}

クラス名 .d02-05-10 は本ライブラリ内での識別用です。複数のパーツを同じページで使う場合は、重複しないよう名前を変更してください。