【スキルハックス】Bootstrapでボタンを作る！色についても学ぶ！

今回はBootstrapで使用頻度が高いと言われているボタンを学んでいきます。また色についても学んでいきます。

CSSの3系でCSSからButtonsをクリック。

まずはリンクを作って、それからclass=”btn btn-default”を書いて、ボタンを作ります。

まずはリンクを作ります。ちなみにURLの後にtarget=”_blank”を書くと、作ったリンクをクリックすると別タブで開いてくれるようにできます。

なぜかリンクの下線が消えていました。『スキルハックス』に問い合わせしたのですが、コードに間違いはないとの事でした。コードを送って、しっかりと確認していただきました。下線を入れる方法を教えてもらえたり、コードをダウンロードするためにフォルダ上でダウンロードしたりと学ぶことが多かったです。丁寧に対応をしていただける環境は有難いなと思いました。

それでは、本題に戻ってclass=”btn btn-default”を書きます。

ボタンを作成することができました。

Bootstrapはprimaryは青、successは緑、infoは水色、warningは黄色、dangerは赤と決まっています。

それぞれのボタンを作成してみます。

上記のようにボタンを作成することができました。

ボタンだけでなく、文字なども変えることができます。

上記のように書きました。

文字の色を変えることができました。primaryは青、successは緑、infoは水色、warningは黄色、dangerは赤は共通になっています。