如何使用bootstrap製作這樣的輸出？

這是我需要作爲輸出？我如何使用bootstrap來做到這一點？ image 如何使用bootstrap製作這樣的輸出？

<div class="container"> 
<div class="row"> 
    <div class="col-lg-8"> 
    -- Content here-- 
    </div> 
    <div class="col-lg-4"> 
    -- content-- 
    </div> 
</div> 
</div>

如何添加這兩列之間的具體差距，請幫助:)

來源

2016-01-22 Nikhil Raj A

如果你想在兩列之間的間隙，你爲什麼不只需添加另一列？像這樣的東西。通過適當的措施減少其他一列或兩列。

<div class="container"> 
<div class="row"> 
    <div class="col-lg-7" style="background-color:white"> 
    -- Content here-- 
    </div> 
<div class="col-lg-1" style="background-color:grey"> 
    -- content-- 
    </div> 

    <div class="col-lg-4" style="background-color:white"> 
    -- content-- 
    </div> 
</div> 
</div>

來源

2016-01-22 07:11:03

此外，您還可以添加一個陰溝類並給它適當的樣式。谷歌它，如果你想，但這相對容易。 –

網站的響應能力有問題嗎？同時增加一個額外的灰色colomn？！ –

不應該考慮Bootstrap會照顧它！ –

添加offset到第二div如下，並使其col-lg-3

<div class="container"> 
<div class="row"> 
    <div class="col-lg-8"> 
    -- Content here-- 
    </div> 
    <div class="col-lg-3 col-lg-offset-1"> 
    -- content-- 
    </div> 
</div>

來源

2016-01-22 07:12:10

只需添加保證金第二網格的左側。

 <div class="container"> 
     <div class="row"> 
      <div class="col-lg-8" style="border: 1px solid black;"> 
    Content here 
    </div> 
    <div class="col-lg-3" style="border: 1px solid black; margin-left: 2%;"> 
    -- content-- 
    </div> 
</div> 
</div>

來源

2016-01-22 07:17:52 Mujtaba

如何使用bootstrap製作這樣的輸出？

回答

相關問題