ここではBootstrap4でのNavbar(ナビゲーションバー)の使い方を説明していきます。 合わせて読みたい記事 https://webst8.com/blog/css-bootstrap4-howto/ ナビゲーションバー(Navbar)の基本的な使い方 まずは、ナビゲーションバー(Navbar)の基本的な使い方から説明します。 ■表示例 ■上記のソースコード
|
<nav class="navbar navbar-expand-md navbar-light bg-light"> <button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#bs-navi" aria-controls="bs-navi" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="bs-navi"> <ul class="navbar-nav"> <li class="nav-item"><a class="nav-link" href="#">ホーム</a></li> <li class="nav-item"><a class="nav-link" href="#">会社情報</a></li> <li class="nav-item"><a class="nav-link" href="#">お客様の声</a></li> <li class="nav-item"><a class="nav-link" href="#">ブログ</a></li> <li class="nav-item"><a class="nav-link" href="#">お問い合わせ</a></li> </ul> </div> </nav> |
&n ...