初級: tableタグの代用にcssとdl, dt, ddを使う書き方

参考

• dl要素でテーブルのような見た目を表現する | kotaログ

サンプル

index.html

<style>
dl {
    width: 20em;
    background-color: #ddd;
}
dt{
    float:left; /* <- ここが一番重要 */
}
dd{
    background-color: #fff;
}
</style>

<dl>
    <dt>項目１</dt>
    <dd>テステステスステステステステステステステステステステステステステステステス</dd>

    <dt>項目２</dt>
    <dd>テステス</dd>
    <dd>テステス</dd>
    <dd>テステス</dd>
    <dd>テステス</dd>
    <dd>テステス</dd>
</dl>

メリット

• cssで見た目を一度作ってしまえば使いまわしやすいかも。
• tableタグと比べてタグが少なく見える?

cssを使わない場合の表示