[解決済み】Bootstrap 3 ナンバーバーの折りたたみについて
2022-04-09 07:35:28
質問
bootstrap 3のナビバーが折りたたまれるポイントを増やす方法はありますか(縦長のタブレットでドロップダウンに折りたたまれるように)?
この2つは、bootstrap2には適用できたのですが、今は適用できません
Twitterのbootstrap-responsiveを使って、navbarのcollapse thresholdを変更する方法は?
デフォルトのレスポンシブ・ナビゲーション・バー・ブレークポイントを変更する
解決方法は?
今日、同じ問題が発生しました。
ブートストラップ4
ネイティブの機能である https://getbootstrap.com/docs/4.0/components/navbar/#responsive-behaviors
を使用する必要があります。
.navbar-expand{-sm|-md|-lg|-xl}
クラスがあります。
<nav class="navbar navbar-expand-md navbar-light bg-light">
ブートストラップ3
@media (max-width: 991px) {
.navbar-header {
float: none;
}
.navbar-toggle {
display: block;
}
.navbar-collapse {
border-top: 1px solid transparent;
box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
}
.navbar-collapse.collapse {
display: none!important;
}
.navbar-nav {
float: none!important;
margin: 7.5px -15px;
}
.navbar-nav>li {
float: none;
}
.navbar-nav>li>a {
padding-top: 10px;
padding-bottom: 10px;
}
.navbar-text {
float: none;
margin: 15px 0;
}
/* since 3.1.0 */
.navbar-collapse.collapse.in {
display: block!important;
}
.collapsing {
overflow: hidden!important;
}
}
変更するだけ
991px
で
1199px
のために
md
のサイズを指定します。
関連
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] Bootstrap3による垂直方向の整列
-
[解決済み] Bootstrap 3 の sr-only とは何ですか?
-
[解決済み] Twitter Bootstrapでナビバーの色を変更する
-
[解決済み】モバイルレイアウトでBootstrap 3の列の順序を変更するにはどうすればいいですか?
-
[解決済み】Bootstrapを使用したフォームのマークエラーについて
-
[解決済み】Bootstrap 3 ナンバーバーの折りたたみについて
-
[解決済み】Twitter Bootstrapのポップオーバーを外側のクリックで解除する方法は?
-
[解決済み】これらの属性は何ですか。アリア・ラベリングビー`とアリア・ヒドゥン`です。
-
[解決済み] BootstrapはCDNから使うべきか、それとも自分のサーバーにコピーを作るべきか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Bootstrap 4のColでコンテンツを下に揃える方法
-
[解決済み] bootstrapでpanel-bodyの背景色を変更するには?
-
[解決済み] Bootstrap 4-alphaでメディアブレークポイントを使用する
-
[解決済み】Twitter bootstrapのモーダルバックドロップが消えない件
-
[解決済み】TwitterのBootstrapを使ってインラインでリストを表示する方法
-
[解決済み】LESSを使わずにbootstrap navbar collapse breakpointを変更する。
-
[解決済み] Twitter Bootstrapを使用して垂直方向の空白を追加しますか?
-
[解決済み] Twitter ブートストラップ スクロール可能なテーブル
-
[解決済み] レスポンシブWebサイトがモバイルで全幅に拡大表示される。
-
[解決済み] Twitter Bootstrapのホストバージョンはありますか?[クローズド]