表組みサンプル (デフォルトの表示)

下記には、HTMLで、(縦)4行×(横)4列のテーブルが記述されています。 4列分よりも狭い画面(ウインドウ)で閲覧されると、横スクロールバーが表示されてしまいます。 (解説記事に戻る)

1行1列目
1行1列目
1行2列目
1行2列目
1行3列目
1行3列目
1行4列目
1行4列目
2行1列目
2行1列目
2行2列目
2行2列目
2行3列目
2行3列目
2行4列目
2行4列目
3行1列目
3行1列目
3行2列目
3行2列目
3行3列目
3行3列目
3行4列目
3行4列目
4行1列目
4行1列目
4行2列目
4行2列目
4行3列目
4行3列目
4行4列目
4行4列目

表組みサンプル (CSSで表を崩してレスポンシブ化した例)

下記は、HTMLでは(縦)4行×(横)4列のテーブルであるものの、CSSによってセル単位で分解し、ウインドウ幅に合わせて表示量が自動調節されるようにした例です。 (解説記事に戻る)

1行1列目
1行1列目
1行2列目
1行2列目
1行3列目
1行3列目
1行4列目
1行4列目
2行1列目
2行1列目
2行2列目
2行2列目
2行3列目
2行3列目
2行4列目
2行4列目
3行1列目
3行1列目
3行2列目
3行2列目
3行3列目
3行3列目
3行4列目
3行4列目
4行1列目
4行1列目
4行2列目
4行2列目
4行3列目
4行3列目
4行4列目
4行4列目

解説記事に戻る