Bootstrap v2.3.1 | 「2系(Bootstrap)」カテゴリー

　状態:- 　閲覧数:4,903 　投稿日:2013-03-09 　更新日:2015-05-19

v2.3.1

バージョン履歴
・2.0.4

「2.1.0」未満バージョンで、マウスオーバーした際のテーブル背景色効果が自動付与される問題

　閲覧数:1,256　投稿日:2013-03-09　更新日:2013-03-27

何が問題？

マウスオーバーした際のテーブル背景色効果が勝手に付与されてしまう
・デザインによっては、この影響で著しく使い勝手が悪くなる場合がある
・例えば、「zebra-striped CSS class」を利用して、テーブル交互色を実現していたとき
・マウスオーバーした際の背景色効果が自動付与されると、見難くなることがある

「2.1.0」未満での対応

・ハックするしかない

.table tbody tr:hover td, .table tbody tr:hover th {
background-color: transparent;
}

.table-striped tbody tr:nth-child(odd):hover td,
.table-striped tbody tr:nth-child(odd):hover th {
background-color: #f9f9f9;
}

「2.1.0」追加オプション

デフォルト挙動の違い
・バージョン「2.1.0」から、デフォルト挙動が変更された

バージョン「2.1.0未満」
・マウスオーバーした際の背景色効果が自動付与される

バージョン「2.1.0以降」
・マウスオーバーした際の背景色効果が自動付与されない
・背景色効果を得るためには、「2.1.0」から追加されたオプション「table-hover」クラスを明示的に指定するよう変更

※恐らくテーブルデフォルトクラスに組み込んでいた効果を、用途に応じて応じて使いやすいよう、最小機能毎に切り出した結果の措置だと思われる

バージョンアップに対応する為に

　閲覧数:1,219　投稿日:2013-03-27　更新日:2013-03-27

配布内容を直接変更しない

・配布CSSを直接変更してしまうと、バージョンアップした際の対応が、面倒なことになる
・極力別ファイルにて、上書き設定していった方が良い

どうしたら良い？

・外国語フォントを指定しているCSS部分を変更せずに、上書きするにはどうすれば良いのだろうか？ transparentみたいに、一旦打ち消すこと出来ないし…

配布ファイル変更内容

・もう既にどこ変更したか分からなくなってる
・これから変更した都度、ここに追記していく予定

Bootstrap2系テーマ／テンプレート

　閲覧数:1,102　投稿日:2013-03-27　更新日:2015-05-19

Bootswatch: Themed swatches for Twitter Bootstrap
・初めて見た時は「うおおお！」と興奮したけど、久しぶりに訪れてみたら、何かギャラリー数が減少したような気がする。もしかして、退化してる？

StyleBootstrap.info: Twitter Bootstrap theme generator
・便利なサイトだけど、まだ実際に利用してはいない

Bootbox.js—alert, confirm and flexible dialogs for Twitter's Bootstrap framework

Twitter Bootstrap Notifications, from Nijiko Yonskai
・このアラート登場の仕方は格好が良いかも
・一定時間経過すると、自動的に閉じるみたいだし

Bootstrapをもっと活用するためのカスタマイズツールやリソースのまとめ

Bootstrap をカスタマイズしてオリジナルテーマを作ってみた … GreenMind
・ざっと見る限り、テーマレベルのカスタマイズではないみたい
・下記2つだけでも使う十分価値はあると思われ

1. アイコンを Web font に変更
本家におけるアイコンは PNG 画像による CSS Sprite で実装されていますが、小さいサイズでの利用に制限されるというデメリットがあります。そこで当テーマでは Elusive Icons という Web フォント形式のアイコンに差し替えることで、サイズだけでなく色も自由に変更できるようにしました。
Elusive icons

5. テーブルをレスポンシブWebデザインに対応
モバイル端末など表示領域の狭い環境においてテーブル表示を最適

・ただ、本家バージョン3.0のリリースがすでに予告されているのであれば、もう少し待ってみようかな、という気はする

・「一部のアイコンは既にWeb font へ変更済」だし、テーブルについても導入こそしていないものの、調査済につき実装目途は付いているので

LayoutIt! - Interface Builder for Bootstrap
・ドラッグ&ドロップでBootstrapのレイアウトを作成出来る

「Twitter Bootstrap」2系のアイコンは、画像なので大きく出来ない

JavaScript in Bootstrap

順位	ページタイトル抜粋	％
1	Bootstrap v2.3.1	81
2	「Bootstrap v2.3.1」不具合	70
3	Bootstrap 3	67
4	Bootstrap 2.0 → 3.1.1	65
5	Bootstrap 4	59
6	Twitter Bootstrap 1.4	54
7	Twitter Bootstrap 2.0	54
8	さよならBootstrap	48
9	JavaScript in Bootstrap	46
10	Group Tabs	46
11	Bootstrap 2.0 × Google MAP API	43
12	FotoSketcher 3.10	42
13	Save As MHT 0.1.3	42
14	Bookmarks clean up	41
15	Bootstrap３系テーマ／テンプレート	40
16	Bootstrap4系テーマ／テンプレート	40
17	Bootstrapをどこまで理解するか？	39
18	Bookmark Sentry	39
19	spacer.gif	38
20	Illustrator CS3でのJavaScript実行方法	38
	2026/7/24 2:19 更新

順位	ページタイトル抜粋	アクセス数
1	Design 0	11
2	「Midjourney」を使用してみた感想。2022 年 8 月 2 時点では、画像生成能力自体は素晴らしいと思いますが、UIが致命的に分かりづらかったです。 \| AI画像生成	3
2	Fireworks で背景画像透明化 \| Fireworks CS3(Fireworks)	3
2	キャラクター無料作成ジェネレーター／ FLASH ／オンラインサービス \| イラスト参考(デザイン)	3
3	SeaMonkey 2.7.2	2
3	パッケージ化されてない拡張機能 \| Chrome 拡張機能	2
3	「CSSプロパティ」書く順番 \| コーディングルール	2
3	「東京都」のカラーコード取得は難しい \| カラーコード(色)	2
3	鉄道会社毎のカラーコード \| カラーコード(色)	2
3	Font Awesome 4.7.0 \| Font Awesome(フォント)	2
4	Click&Clean \| Chrome 拡張機能	1
4	Illustratorでaiファイルを保存する際、下位バージョンでも開けるよう保存する \| Illustrator CS3(Illustrator)	1
4	Illustrator CS3(Illustrator) カテゴリー	1
4	試行履歴	1
4	Chromeをインストール出来ない \| Google Chrome(ブラウザ)	1
4	カラーコード／色コード \| カラーコード(色)	1
4	Firefoxが重いときの対策（案） \| Firefox(ブラウザ)	1
4	2.stroke-widthプロパティの幅設定は、「与えられた点を中心とする」strokeプロパティ仕様に準じている	1
4	Chrome「39.0.2171.95 m」で崩れたデザインが「39.0.2171.99 m」で直る	1
4	「Icon Font」を「Font Awesome」で統一 \| Font Awesome(フォント)	1
	2026/7/23 5:05 更新