2015-11-17 50 views
0

請檢查這兩張照片引導 - 股利與.fluid容器內盒裝電網

http://i.stack.imgur.com/5J3wQ.png

http://i.stack.imgur.com/fJvek.jpg

我不知道怎麼去「.myDivInTheGrid」在盒裝引導DIV 。有什麼建議麼?

我有這樣的事情......

<div class="fluid-container"> 
     <div class="col-md-6"></div><!-- Div with image --> 
     <div class="col-md-6"> 
      <div class="myDivInTheGrid"></div> 
     </div><!-- div with content --> 
    </div> 

回答

0

我已經創建與您在圖片顯示DIV圖片的工作示例。我是爲col-md-*製作的,但您可以對較大的網格系統執行相同的操作。如果您的屏幕很小,請拉伸瀏覽器。檢查出來HERE

的代碼是這樣的: HTML

body 
    <div class="container-fluid"> 
    .fluid-container 
    <div class="row"> 
     <div class="col-md-6"> 
      .col-md-6 
     </div> 

     <div class="col-md-6"> 
      <div class="row"> 
       .col-md-6 
      </div> 
      <img class="row" src="http://s22.postimg.org/8z6hs0mch/Chrysanthemum.jpg"/> 
     </div> 
    </div> 
    </div> 

CSS:

body{ 
    background:#8EC34D; 
    color: white; 
} 

.container-fluid { 
    background: #81AD4B; 
    position: relative; 
    top: 40px; 
    padding-bottom: 40px; 
} 

.col-md-6 { 
    background:#769C47; 
    height: 300px; 
    } 

img { 
    width: 256px; 
    height: 192px; 
}