表を横にスクロール可能なレスポンシブテーブルを実装する | Web Tips公開日：2014年9月26日 最終更新日：2015年1月6日 スクリーンサイズが小さいスマートフォン画面で表組みする際は、はみ出した部分を横にスクロール可能なレスポンシブテーブルという手法を使います。JavaScriptで作った専用のライブラリもありますが、CSS設定だけで簡単に実装する方法を解説します。 作成するテーブルは右図になります。 横幅はスクリーンサイズに応じて変化しますが、640pxをブレイクポイントとして行と列が反対になります。 640pxより小さいスクリーンでは横にスクロール可能なレスポンシブテーブルとなります。 スマホでもPCでも動作するデモページを用意しましたのでご覧ください。 ＞＞ レスポンシブテーブル DEMO ページへ 【コンテンツ】 HTMLコードを作成する CSSコードを作成する HTMLコードを作成する テーブル部分の HTMLコードは以下になります。 注意
