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

Bootstrap ＞ 2系

Gist

　状態:- 　閲覧数:3,317 　投稿日:2013-01-08 　更新日:2014-11-26
バランスが悪い
・大きいボタンにアイコンを配置したら、バランスがおかしいことに気が付いた
・要は、「Twitter Bootstrap」のアイコンは画像なので、これ以上大きく出来ない、てことらしい

対策 … Wrbフォント利用
Font Awesome(v3.0)
・海外
・デフォルトで、「Twitter Bootstrap」のアイコン記述に対応

Ligature Symbols(v2.09)
・日本
・「Twitter Bootstrap」アイコンのように利用するには、カスタマイズが必要

・概要は、ここで把握できる
・実際に実装する際は、こちらを参考にする(但し、公式サイトではないので、「Ligature Symbols」の最新が揃っているわけではない。例 「myspace」など)

「Bootstrap, from Twitter 2」で、「Dropdowns bootstrap-dropdown.js」が動作しないときの対応案

Bootstrap v2.3.1



類似度ページランキング
順位 ページタイトル抜粋 ％
1 「Twitter Bootstrap」2系のアイコンは、画像なので大きく出来ない 83
2 「Twitter Bootstrap」のアイコンは、画像なので色を変更できない 68
3 Twitter Bootstrap 2.0 43
4 「Twitter Bootstrap」✕「フォーム」 42
5 「Bootstrap, from Twitter」を利用する際、「current page」では白アイコンを利用する方法 42
6 「Twitter Bootstrap」導入したらおかしくなった時、試した方がよいかもしれないこと 41
7 Twitter Bootstrap 1.4 39
8 Twitter ヘッダー画像は、Fireworks CS3 で作成している 39
9 「PhotoShop CS3」　と、「Vieas」　の違い 38
10 「:after擬似要素」は、Chromeの「要素を検証」で確認できない 37
11 positionプロパティのrelative指定は、デフォルトではない 37
12 「Bootstrap, from Twitter 2」で、「Dropdowns bootstrap-dropdown.js」が動作しないときの対応案 37
13 「Bootstrap v2.3.1」不具合 36
14 「Bootstrapデザイン」✕「グラフ」 36
15 「異なるキーフレームアニメーション名」に、「transformの異なる値」を記述できない 36
16 「Data URI scheme」画像拡張子は、正しいとは限らない 36
17 SVGの色指定は、「枠線 stroke」と「内部 fill」の2種類 35
18 私がよく利用するFont Awesome 無料アイコン。毎回探すことが面倒なので 35
19 Firefoxだけがログインできない 34
20 Fireworks で背景画像透明化 34
2026/9/15 7:58 更新
週間人気ページランキング ／ 9-8 → 9-14
順位 ページタイトル抜粋 アクセス数
1 Design 0 4
2 「コズミックブルー」は、くすんだ青系全般の色を指す用語だと思います。 | カラーコード(色) 3
3 「東京都」のカラーコード取得は難しい | カラーコード(色) 2
3 SeaMonkey 2.7.2 2
3 CSSトラブル対応(CSS) カテゴリー 2
3 Inkscape | ソフトウェア 2
3 Flickrがサポートするライセンス 9 ＋ 特別なライセンス 2 | 画像著作権(画像) 2
3 アカウント作成 2
3 パッケージ化されてない拡張機能 | Chrome 拡張機能 2
3 テーブル枠線がどうしても消えない時は「border-collapse: collapse;」 | Backgrounds and Borders Module(CSS) 2
4 探している「HTML5エディタ」 | HTMLエディタ 1
4 RGB → HSL 変換式 ／ 約分対応 1
4 右クリック出来るのに、コピペ出来ないWebページ。2020 年 | ブラウザ 1
4 StableDiffusionのweb版「DreamStudio」を使用してみた感想。それなりに楽しめましたが、課金してまで使用してみたいとは思いませんでした。 | AI画像生成 1
4 キャラクター無料作成ジェネレーター ／ FLASH ／ オンラインサービス | イラスト参考(デザイン) 1
4 Illustratorでaiファイルを保存する際、下位バージョンでも開けるよう保存する | Illustrator CS3(Illustrator) 1
4 「Google Chrome」で「This browser does not support WebGL」と表示される場合は、ハードウェアアクセラレーションに不具合がある可能性があるため、設定画面よりハードウェアアクセラレーションを一旦無効にしてみる | Google Chrome(ブラウザ) 1
4 検索エンジンなら画像掲載はOKなの？ | 画像著作権(画像) 1
4 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 1
4 Font Awesome 4.7.0 | Font Awesome(フォント) 1
2026/9/15 5:05 更新