0

私は Bootstrap で Web を作成していますが、Bootstrap のドキュメントでも解決できない深刻な問題に直面しています。だから、これは私のコードです：

<div class="container">
  <div class="hero-unit">
    <h2>Two Rows</h2>
        <div class="row">
          <div class="span6">
            <center>
            <img src="../img/renders/example.png" style="position: absolute; width: 200px; height= 200px; margin-top: 80px">
            <img src="../img/covers/some_image.jpg" title="Image title" class="img-rounded propiedades_imagenes">
            </center>
          </div>
        </div>
          <div class="span6">
            <div class="well" style="margin-top:130px">
              <a class="btn btn-large btn-primary" href="#link">
                <i class="icon-download"></i> Download</a>

              <a class="btn btn-large btn-inverse" href="#random.html" style="margin-left:272px">
                <i class="icon-random icon-white"></i></a>
            </div>
          </div>
        </div>

Hero-Unit 内に 2 つの行を作成しようとしています。レスポンシブ デザインをアクティブにするとうまくいきましたが、それをアクティブにすると、ページは私のものよりも小さい画面と大きい画面でデザインを使ってクレイジーなことをするだけです。そのため、bootstrap-responsive.css へのリンクを削除し、「class=row-fluid」の代わりに「class=row」を配置しましたが、2 行ではなく 1 行を作成し、2 行目のすべてのコンテンツを配置しました最初のものの下。

私は何か間違ったことをしていますか？レスポンシブでこれを行う方法は知っていますが、すべての作業が台無しになります。

私が欲しいものとレスポンシブ デザインで得られるものの画像: http://i1129.photobucket.com/albums/m518/ZoxSoft/Capturadepantalla2013-08-13alas000037_zps064f71b1.png

4

2 に答える 2

0

Bootstrap や Hero-unit に詳しくない

しかし、別のDivが必要だと思いますclass="row"

何が起こっているのか、何をしているのかを視覚化せずにトラブルシューティングを行うのは困難です。しかし、一見すると、行のクラスを持つ別の div タグが必要です。

提供したコード スニペットの最後に3 つ</div>あり、閉じる必要があるのは 2 つだけですか?

新着

最初の画像リンクでは、スタイリングがたくさんあるように見えますが、タイトル属性もクラス属性もありません

そのクラス属性がないと、レスポンシブおよびヒーローユニットはそれを取得することを知りません

于 2013-08-12T21:53:43.070 に答える