Code Log

プログラミングの勉強メモを残していきます。

Bootstrap

Bootstrap ボタンの色一覧とその意味

Bootstrapでは目的に応じてボタンの色を指定することができます。 クラス名 色 意味 btn-default 白 デフォルト btn-primary 青 プライマリ。選択されている状態や規定の項目を表現する。 btn-success 緑 成功 btn-info 水色 情報 btn-warning オレンジ 警告…

Bootstrap テキストフォームを1行に右側や左側で横並びにする

Bootstrapでテキストフォームを横並び 一行で表示したい。 ユーザIDとパスワードを右上に並べて表示したり、あるいは左側に並べてみたり。実現するためには、 <form method="post" action="hoge" class="form-inline text-left"> のように、formタグにclass="form-inline text-XXXX"を指定してやればいい。サンプルの画像はこ</form>…

Bootstrapのtextareaに注意書きみたいなヘルプを付け加える

textareaがあって、その下に「※1000文字以内で入力してください」みたいな、薄いグレーの文字で、注意書きが書いてあるサイトを見かけると思う。 具体的にはこんな感じの。このヘルプの文字を出すには、「help-block」というクラスを指定すればいい。 上の画…

Bootstrapでラジオボタンやチェックボックスを横並びで1行にまとめる方法

今回は、Bootstrapでラジオボタンやチェックボックスを横並びにする方法を見ていきます。 まず最初に、普通に縦に並ぶ例を見て、それから横並びにする方法を試してみます。結論から言うと、「radio-inline」と「checkbox-inline」をクラス名として指定すれば…

Bootstrapをはじめる。対応しているjQueryのバージョンなど。

Bootstrapを使うための準備をしてみます。 必要なファイルなどをダウンロードしましょう。 Bootstrap jQuery Respond.js html5shiv CDNを使う場合 テンプレート Bootstrapまずは、以下のサイトの「Download」をクリックして、Bootstrapを手に入れます。 http…