Bootstrap給予DIV優先

我是新的引導和愛好它。但是，我有一個輕微的問題，我不知道如何解決。爲了更好地解釋它，我制定了一個簡單的網站佈局。Bootstrap給予DIV優先

這是網站的外觀一般桌上型顯示器 enter image description here

這是網站的外觀手機（iPhone 5S）

enter image description here

上我想要的一切留下來作爲除了移動版本的佈局外，我希望圖片在其他任何東西之前先出現（AkA位於頂部）。但是，我所做的任何更改似乎都會在常規桌面顯示器上搞砸了。有什麼方法可以優先考慮div的東西嗎？我也認爲這是一種隨機的移動佈局圖像後的文本框，但我想這是由於我的代碼。

我的代碼如下。

<div class="container"> 
     <div class="row item"> 
      <div class="col-sm-5"> 
       <h1>Test Tile!</h1> 
       <p id="test">Text Text Text</p> 
       <form id="newsletter" action="" method="POST" class="form-inline" role="form"> 
        <div class="form-group"> 
        <label class="sr-only" for="exampleInputEmail2">Email address</label> 
        <input type="EMAIL" name="EMAIL" class="form-control" id="EMAIL" placeholder="Enter your email"> 
        <button type="submit" class="btn">submit</button> 
        </br> 
        </div> 
       </form> 
      </div> 
      </br> 
      <div class="col-sm-7"> 
       <img src="img/product_image.png" class="img-responsive main" alt="product image" /> 
      </div> 
     </div>

謝謝！

來源

2014-02-24 Teddy13

將div與img首先放入您的標記中，並將.col-md-push-7 css類添加到它。它應該顯示你想要的。

來源

2014-02-25 22:50:48 MrJinPengyou

這一切都取決於你的標記。

如果你有<div />第一，然後<img />那當然<img />將始終的<div />後呈現。

所以，你需要做的是交換周圍您的標記，因此<img />是第一位的，然後在你的桌面特定css你必須要麼float或position的<div />和<img />顯示，只要你想，然後在移動版本上它應該自動定位。

來源

2014-02-24 08:29:01 diceler

Bootstrap給予DIV優先

回答

相關問題