ドロップダウンを使う - Bootstrapのチュートリアル

このレッスンではドロップダウン メニューを作ってみます。 今開いてるドキュメントは button があって あとはリンクが３つあります。 button はこちらですね。そして リンクが div 要素の中に入っていて その button とリンクをさらに div 要素で囲んでいます。 ではこれを dropdown menu に したいと思います。 まずこの一番外側の div ですね。 ここに class として dropdown を設定します。 次に button なんですが、button の class が設定されていますけれども そのあとに続けて dropdown-toggle という class を設定します。 それからこの type のあと また属性を追加するんですけれども data 属性です。data-toggle と そして値は dropdown というふうにします。 data-toggle で、値は dropdown ですね。 そうしたら今度は、この メニューの項目の方ですね。 こちらも div 要素なんですけれども class は dropdown-menu です。 あとはこの a 要素、それぞれについて class を定めるんですけれども こちらは dropdown-item ということになります。 これはコピーしましょうね。 コピーして ペースト、ペーストで 保存しましょう。 ボタンの右には三角ボタンがついて ボタンをクリックすると ドロップダウンが出てきます。 もう一回クリックすると 閉じると。それから開いておいて 飛び先ありませんけれども クリックするとハイライトします。 次にこの dropdown の メインメニューのボタンなんですが button でなくリンクに することもできます。 ということでこれを コピーして 下にペーストします。 そしたらこの div 要素 外枠は一緒ですね、この button の部分が a 要素に変わります。 ですから href でここは # に しておきます。 あと type button は、これは 属性としておかしいので 削除してしまいます。あと カラーが btn-primary に なっていますけれども、もちろん 他のカラーも使えますので ここは secondly にしましょう。 ということで…