CSSだけで「横並び」と「縦並び」を切り替え可能なテーブルを，dl・dd・dtタグで作ろう （table要素を使わない，変更しやすい表組みレイアウトの実装方法） - 主に言語とシステム開発に関して

HTML上で表組みを実装する際には，table要素を使うのが一番手っ取り早い。 しかし，tableで作った表組みは，変更しづらい。（メンテ性がよくない） 例を挙げよう。 下記のように，「項目名」と「項目の説明」が横並びで並んだ表組みがあるとする。 この表組み内の全セルを，縦並びに変更したいとする。 table要素でレイアウトした場合，このような変更はしんどい。 HTMLソースを書きなおして，テーブルの全行を２行ずつに分割する必要がある。 この変更作業において，「文書の構造」は変わっていないつもりだ。（それを表現するのはHTMLのはず） ただ単に「見せ方」を変えたいだけなのだ。（それを表現するのはCSSのはず） にも関らず，HTMLソースを全部書き直さないといけない。 おかしいと思わないか？ 実は，tableタグを使わず，「DL」タグを使って表組みを実装すれば， 上記のような変更はCSSをち

[tenchikometen]

レスポンシブ　table

[mamehei]

定義リスト