を崩壊する幅私はnavbar-collapse
でTwitterのBootsrap 3を使用する:あなたはページの幅を小さくするとhttp://bootply.com/91119Twitterのブートストラップ3ナビゲーションバー - 崩壊 - セット
、メニューは2行に分割し、その後崩壊します。 私は2行に分割しませんが、崩壊したいと思います。 私は何をしますか?
を崩壊する幅私はnavbar-collapse
でTwitterのBootsrap 3を使用する:あなたはページの幅を小さくするとhttp://bootply.com/91119Twitterのブートストラップ3ナビゲーションバー - 崩壊 - セット
、メニューは2行に分割し、その後崩壊します。 私は2行に分割しませんが、崩壊したいと思います。 私は何をしますか?
あなたはナビゲーションバーが崩壊するポイントを減らすことができます。..
あなたのナビゲーションバーの内容に応じて、ブートストラップのドキュメント(http://getbootstrap.com/components/#navbar)
からオプション1
、あなたはnavbarが折りたたまれたモードと水平モードの間で切り替わるポイントを変更する必要があるかもしれません。 @ grid-float-breakpoint変数をカスタマイズするか、独自のメディアクエリを追加します。
オプション2
カスタムブートストラップビルドをしたくない場合は、CSSメディアクエリを使用することができます。例えば、ここに1280個のピクセルにブレークポイントを設定している:ブートストラップ3.1
ため
@media (max-width: 1280px) {
.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;
}
}
アップデート3.1のナビゲーションバーが変更されているので、ブレークポイントを無効にするCSSはより異なっています3.0。これは、3.1 http://www.bootply.com/120604
おかげスケリーに崩壊突然、次に示すからナビゲーションバーを防ぐことができます、それはあまりにも私を助け:) 3.1では – Alyas
を、@グリッド・フロートbreakpoint'はまだ少ないよう、動作します 'カスタマイズのオプション1この変数を使用して更新されたCSSを生成します。変数を修正するための私の好みのテクニックは、私のプロジェクトでソースLessを使用し、ブートストラップをインポートする新しいLESSファイルで変数を個別にオーバーライドすることです。つまり、カスタマイズを失うことなくブートストラップの新しいバージョンにアップグレードできます。 –