サイトに Twitter ブートストラップを使用してレスポンシブ デザインを実装しました。折りたたみ式のナビゲーション バーはスマートフォンではうまく機能しますが、タブレットや iPad ではうまく機能しません。基本的に、折りたたみ可能なナビゲーションをタブレットまたは iPad に自動的に実装したいと考えています。ブートストラップのドキュメントが少しわかりにくいです。誰でもガイダンスを提供できますか。
質問する
696 次
1 に答える
3
Bootstrap はデバイスによっては機能しません。(CSS メディア クエリを介して) 画面幅を使用して、特定の幅でナビゲーション バーを折りたたみます。したがって、iPad でデフォルトで有効にする唯一の方法は、iPad の画面幅 (縦モードで 768px) 以上に折りたたむことです。
私は過去に同じことをしたことがあり、いくつかの場合に、の@media一部を形成するクエリを編集してbootstrap-responsive.css、より適切な幅でタブレット用に折りたたむことになりました。例えば：
@media (min-width: 768px) and (max-width: 979px) {
hereで詳しく説明されているように、より進歩的な方法は、ニーズに合わせてブートストラップをカスタマイズし、カスタム変数を使用する@navbarCollapseWidthことです。ページにリストされている変数を変更しますが、幅を手動で編集することをお勧めします...
補足として、さまざまな一般的なタブレットやデバイスの画面幅を調べる価値があるでしょう。これが役立つかもしれません:メディア クエリ: デスクトップ、タブレット、モバイルをターゲットにする方法は?
于 2013-03-28T21:49:47.363 に答える