レスポンシブ

CSSで作ったボタンに画像アイコンを付ける

CSSだけで作るボタンに画像アイコンを付ける方法です。スマホサイズにも対応してます。 前にアイコンがあるパターン 緑のボ […]

【レスポンシブ対応】スクロールしてもサイドメニューが固定されるjQueryプラグインFit sidebar

スクロールでサイドメニューが見えなくなってしまうのを回避するときに便利なのがjQueryのプラグイン「Fit sideb […]

Bootstrap3に用意されているクラス【アラート編】警告メッセージ・エラーメッセージ

アラート alert 警告メッセージなどアラート用に使うクラスです。.alert + .alert-success等のク […]

retina.jsで画像が表示されないときの対処法

以前Retinaディスプレイ対策で使用したretina.js 通常の画像と@2xの画像を用意しておけば勝手に切り替わって […]

Bootstrap3に用意されているクラス【ドロップダウン編】

ドロップダウン dropdown 基本 ドロップダウン メニュー1 メニュー2 メニュー3 <div class= […]

JavaScriptでスマホやタブレットを判別する方法

JavaScriptでスマホかタブレットかパソコンかを判定する方法です。 使い方 getDevice が”s […]

Bootstrap3カラムの位置を調整する方法【カラムのオフセット】

Bootstrapのカラムを利用していると1つカラムを飛ばしたいときや余白を空けたい、中央に配置したいときがあります。そ […]

スマホやタブレットで画像がぼやけるときの対処法

iPhoneやiPadなどスマートフォンで画像がぼやけるときありませんか?Retinaディスプレイと呼ばれるスマホの高精 […]

固定ヘッダーがスマホでずれるときの対処法

ヘッダーを固定するposition:fixed; レスポンシブサイトでヘッダーを固定をした場合、スマホで見るとヘッダーが […]

img-responsiveの画像をセンター寄せにする方法

Bootstrapで画像をレスポンシブにする方法はimg-responsiveを使いますが、左寄せになります。センター寄 […]

Bootstrap3に用意されているクラス【ボタン編】

ボタン btn btn-*** <button>ボタン要素や <a>アンカー要素のクラスに.bt […]

Bootstrap3に用意されているクラス【パネル・リスト編】

グレーの枠 well グレーの囲み枠を表示してくれるクラスです。 デフォルト well … <div […]

Contact Form 7をBootstrapで使用してみました

フォームを作るのに便利なWordPressのプラグイン「Contact Form 7」。Bootstrapのデザインを使 […]

Bootstrap3のグリッドシステム

Bootstrap3のグリッドシステムを利用すればレスポンシブサイトが簡単に作ることができます。 グリッドシステムって? […]

Bootstrap3に用意されているクラス【color編】

Bootstrap3に標準で用意されているクラス【color編】をまとめてみました。 文字の色 text-**** 文字 […]