3

ブートストラップ AZY レスポンシブ 1 ページ テンプレートをダウンロードしましたが、768 x 1024 (iPad - ポートレート) の解像度で、固定ナビゲーション バーが画面の上部に表示されません。240 x 320 から 1024 x 768 までの他のすべてでは、上部に固定されたままです。

フィドルを作成しました: http://jsfiddle.net/B2sw6/

これを使用してみましたが、うまくいきませんでした:

.navbar-fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
    top: 0;
}

中央の仕切りバーをドラッグすると、約 幅が 768px の場合、黒いナビゲーション バーが上部に留まるのではなく、ページの残りの部分と共に上にスクロールします。

これを修正するために CSS を更新する方法に関するヒントはありますか?

4

2 に答える 2

1

小さな修正だけを行う必要があります。position:fixed;最大 979px のメディアクエリで .navbar-fixed-top に追加します。

変化する

@media (max-width: 979px){
  .navbar-fixed-top {
  margin-bottom: 0px;
  }
}

@media screen and (max-width: 979px){
  .navbar-fixed-top {
    margin-bottom: 0px;
    position: fixed;
  }
}

幸運を。

于 2013-04-05T17:11:28.773 に答える
0

css にメディア クエリがあります。

@media (max-width: 979px)
.navbar-fixed-top, .navbar-fixed-bottom {
position: static;
}

に変更します

position: fixed

そしてそれはうまくいくはずです!

于 2013-04-05T07:26:34.077 に答える