4のハンバーガーメニューのSVG背景画像をやめてメニュー開閉時にアニメーション出来る設定にする2019.06.07Bootstrap4のデフォルトのナビゲーションは、3の時と少し書き方が異なっており、ハンバーガーメニュー独特の「三」は、下記のCSSの記述のようにSVGの背景画像として設定されています。23h22'/%3e%3c/svg%3e");}しかし背景画像だと、メニューを押した時にCSSのtransformを活用して「シュッ」とアニメーションをして見た目を「☓」に変化させることは出来ません(一応、下記のように設定することで、メニューが開いている時の背景画像を変えることは出来ます。4のハンバーガーメニューだけ、先述のような「シュッ」としたアニメーションが出来るように書き換えてみました。参考リンクカスタマイズ詳細まずは、HTMLファイル。4のデフォルトでは1つしかないspanの記述ですが、これを3つにします。class="navbar-toggler-icon"></span>次に、CSSファイルの書き方の一例。いったところでしょうか。rotate(-45deg);}他の注意点としては、bootstrap本体のバージョンアップが必要な時に作業をスムーズに行えるよう、style.cssなど、bootstrap.cssとは別のCSSファイルに記載するようにしましょう。Scrawl.ホーム検索トップ。