2列自举固定宽度图像

是否可以做这样的事情？ http://morenheit-vesna.tumblr.com/2列自举固定宽度图像

说我有5幅图像宽度相同但高度不同。我怎样才能做到这一点？

<div id="content"> 
    <img src="http://66.media.tumblr.com/77855c8b4bb6accb5713c746c730e94c/tumblr_o8gwskDNhK1t0yoveo1_500.jpg"> 
    <img src="http://65.media.tumblr.com/1a0b08e263025da71c9312014e7aa791/tumblr_o5xcdidD051tvh80lo1_500.jpg"> 
    <img src="http://65.media.tumblr.com/578a06593a0efc258e62fd5546d096f7/tumblr_o5gdhuOJcx1rx771wo1_500.png"> 
    <img src="http://65.media.tumblr.com/7701c0870eb08dda60cd7490edf472ed/tumblr_mrs5f7cI9z1rnb624o1_500.jpg"> 
    <img src="http://66.media.tumblr.com/bac0f0e6a248059a2cd61d6f43e34689/tumblr_ngspo2vD3V1t0yoveo1_500.jpg"> 
</div>

现在，他们都在与y轴相同的宽度一列没有垫衬

来源

2016-06-26 funky-nd

我认为，我所做的：d

<div id="content"> 
<div class = "col-md-6 text-center"> 
    <img src="http://66.media.tumblr.com/77855c8b4bb6accb5713c746c730e94c/tumblr_o8gwskDNhK1t0yoveo1_500.jpg"> 
    <img src="http://65.media.tumblr.com/1a0b08e263025da71c9312014e7aa791/tumblr_o5xcdidD051tvh80lo1_500.jpg"> 
    <img src="http://65.media.tumblr.com/578a06593a0efc258e62fd5546d096f7/tumblr_o5gdhuOJcx1rx771wo1_500.png"> 
</div> 
<div class = "col-md-6 text-center"> 
    <img src="http://65.media.tumblr.com/7701c0870eb08dda60cd7490edf472ed/tumblr_mrs5f7cI9z1rnb624o1_500.jpg"> 
    <img src="http://66.media.tumblr.com/bac0f0e6a248059a2cd61d6f43e34689/tumblr_ngspo2vD3V1t0yoveo1_500.jpg"> 
</div>

来源

2016-06-26 10:47:12

有几种选择。一个是创建一个表格，比如说5列，并且在每个表格单元格中部署每个单元格所需的所有图片（当然要考虑边距）。

来源

2016-06-26 10:47:28 FDavidov

你甚至可以尝试float选项，然后使用margin到如下正确对准他们，

#content > img{ 
    float:left; 
    margin:10px; 
}

来源

2016-06-26 10:50:38 frnt

但引导响应.S –

的确是这样，但调整是在两者之间的间隔，你可以尝试保证金从上面，（即）图像底部或顶部或左边或右边。 – frnt

2列自举固定宽度图像

回答

相关问题