1

静的にセットアップされたブートストラップWebサイトがありますが、さまざまなビューサイズに応じて調整されません。ですから、応答性を高めたいのですが、どうすればよいかわかりません。また、LESSを使用して、twitterブートストラップcssの変更などを行っています。これまでのところ、私のサイトはそのように設定されています。

<div id="wrapper">
   <header>
      <div class="container">
         <div class="row">
            <div class="span12">
               <!-- LOGO HERE -->
            </div>
         </div>
      </div>
   </header>
   <div id="main-content" class="container">
      <div class="row">
         <div class="span8">
            <!-- My content -->
         </div>
         <div class="span4">
            <!-- My content too -->
         </div>
      </div>
   </div>
</div>

また、Webサイトは940ピクセル用に構築されているため、応答性を高めるときに、ページの最大ビューを1200ピクセルではなく940ピクセルに設定し、div.wrapperをページの中央に配置したいと思います。

うまくいけば、これがすべて意味をなすハハになります。

4

2 に答える 2

1

に変更.containerします。これを見てください：http：//jsfiddle.net/ypkJQ/。また、すべての.row-fluidクラスがspan * widthカウンターをリセットすることも覚えておく必要があります。つまり、.row-fluidの下のspan * widthは、親（.row-fluid）のパーセンテージ幅から取得されます。.container-fluid.row.row-fluid

于 2013-03-05T16:42:59.913 に答える
1

レスポンシブレイアウトをオンにするに<head>は、ドキュメントのに次のコードを追加する必要があります。

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

.lessソースを使用しているため、スタイルシートへの参照を特定の構造に調整する必要があります。

response.lessでコメントアウトするか、次の行を削除します。

@import "responsive-1200px-min.less";

これは小さい画面解像度に対応しますが、最大.container幅を940pxに保ちます。

于 2013-03-05T16:58:12.163 に答える