0

よくわからない問題が1つあります。オンラインサンプルを作成しました。ウィンドウのサイズを変更すると、SPANが1つずつ応答します。オンラインサンプル http://jsfiddle.net/Pva7y/1/

オンライン画像 ここに画像の説明を入力してください ここに画像の説明を入力してください

ただし、同じコードをローカルhtmlにコピーし、SPAN応答を一緒にコピーしました。ローカルイメージ。

なぜ違うの？ありがとう

ここに画像の説明を入力してください

HTML：

<div class="row ">
    <div class="span7 blue">
    1
    </div>
    <div class="span2 red">
       2
   </div>
    <div class="span3 green">
      3
    </div>
</div>

CSS：

.blue{background-color:blue;}
.red{background-color:red;}
.green{background-color:green;}
4

2 に答える 2

0

まず、containerdiv の使用を忘れていることです。正しいパターンは

<div class="container">
  <div class="row">
    <div class="span12">
      1 2 3
    </div>
  </div>
</div>

修正された jsfiddle (1)を参照してください。

次に、ページをレスポンシブにし、レイアウトをビューポートのサイズに合わせたい場合は、 も含める必要がありますbootstrap-responsive.css。jsfiddle (2)を参照してください。あなたのローカル HTML では、クライアント サーバー リクエストの数を減らすために、bootstrap.cssとbootstrap-responsive.css以前のファイルの両方を 1 つの CSS にマージして使用しました。

于 2013-03-08T09:10:53.200 に答える
-1

あなた<div>の s は Fiddle に浮かんでいますが、スクリーンショットから判断すると、ローカルの html には浮かんでいません。また、bootstrap.css はスパンのクラスで要素をフロートするため、<div>bootstrap.css がローカルの html ファイルに正しく読み込まれていないと推測しています。

問題をトラブルシューティングする方法は、Inspector (Chrome を使用している場合) または Firebug (Firefox を使用している場合) を確認することです。<div>フィドルとローカル htmlの 3 つの s のコンピューター スタイルを見て、それらを比較します。同じブラウザでも見た目が異なるため、スタイルが異なっているはずです。それがトラブルシューティングの開始方法です。

于 2013-03-07T21:34:49.873 に答える