Bootstrap 3 のレスポンシブテーブル

Webデザイン

カテゴリー: 3系  閲覧数:1028 配信日:2014-05-13 21:02


公式ドキュメント


Bootstrap 3 の「Responsive tables」に搭載されている機能
・モバイルサイズなどで画面からはみ出した場合、横スライド可能な状態で表示
Create responsive tables by wrapping any .table in .table-responsive to make them scroll horizontally up to small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.

期待値以下
・期待していた程、Bootstrap 3 のレスポンシブテーブル機能は充実していないことが判明
・上記 FooTable ライブラリ導入を決意

週間人気ページランキング / 6-30 → 7-6
順位 ページタイトル抜粋 アクセス数
1 「東京都」のカラーコード取得は難しい | カラーコード(色) 11
2 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 10
2 鉄道会社毎のカラーコード | カラーコード(色) 10
3 utf-8ではなく、UTF-8 | HTML 7
4 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Chrome 拡張機能 6
5 RGB ⇔ Lab | 色変換(色) 5
5 カラーコード / 色コード | カラーコード(色) 5
5 金融機関ブランドカラー / コーポレートカラー | カラーコード(色) 5
6 「z-index」効果を打ち消すスタイルシートは、「z-index:auto;」 4
6 16進数カラーコード / 2進数 4
6 RGBの種類 / ビットカラー | RGB(色) 4
6 キャラクター無料作成ジェネレーター / FLASH / オンラインサービス | イラスト参考(デザイン) 4
6 効果を打ち消すスタイルシート | CSS 4
6 RGB ⇔ XYZ / CIE RGB / sRGB(D65) / sRGB(C) / Adobe RGB / NTSC RGB 4
6 RGB → 色相H … 最大値基準 × 図形 の考え方 | 色変換(色) 4
6 Flickrがサポートするライセンス 9 + 特別なライセンス 2 | 画像著作権(画像) 4
7 「文春オンライン」に掲載されている画像を「Google Chrome」ブラウザでダウンロードするためには、chrome拡張機能「Absolute Enable Right Click & Copy」を使用します。 | 画像 3
7 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 3
7 デザイン変更 | Webデザイン(デザイン) 3
7 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 3
2025/7/7 1:01 更新
指定期間人気ページランキング / 2020-5-30 → 2025-7-6
順位 ページタイトル抜粋 アクセス数
1 RGB ⇔ Lab | 色変換(色) 8624
2 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 4557
3 血の色 / #b30000 / #360800 / #ff0000 | 色 3732
4 Design 0 3695
5 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 2698
6 RGBの種類 / ビットカラー | RGB(色) 2642
7 「bgcolor」「background-color」「background」の違い | CSS 1975
8 金融機関ブランドカラー / コーポレートカラー | カラーコード(色) 1876
9 16進数カラーコード / 2進数 1831
10 コズミックブルーが何色か分からない | 色 1804
11 「:hover」「z-index」を組み合わせて使用すると、正常動作しないことがある | z-index(CSS) 1660
12 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 1649
13 「属性」「プロパティ」「アトリビュート」の違い | CSS 1592
14 「Bootstrapデザイン」✕「グラフ」 | 2系(Bootstrap) 1509
15 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Google Chrome(ブラウザ) 1420
16 Chrome でキャッシュを効かさない | Google Chrome(ブラウザ) 1357
17 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 1307
18 「東京都」のカラーコード取得は難しい | 色 1168
19 HSLとHSVの違い | 色変換(色) 1150
20 「Chrome拡張機能」開発中に遭遇したエラー | Chrome 拡張機能 1102
2025/7/7 1:01 更新