0

我正在使用 Bootstrap 为房地产经纪人做一个网站,而 MLS 图像是各种古怪的尺寸,这给了我一个时髦的布局。处理此问题的最佳方法是什么,以便文本从每行中的相同位置开始?

在 css/js 中是否有一个好的解决方案,或者我应该在一些标准化纵横比的 imagemagick 处理之后制作图像的副本?

http://jsfiddle.net/MgcDU/1055/和下面的来源

<div class="container">
    <div class="row">
        <div class="span4">
            <h4>123 Happy Tree Lane</h4>
            <img src="http://placehold.it/767x575" class="img-rounded"/>
            <p>A-list networks niches ROI tagclouds architect, users strategic granular applications maximize functionalities streamline</p>
            <p><a class="btn" href="#">View Details &raquo;</a></p>
        </div>
        <div class="span4">
            <h4>666 Doomsday Road</h4>
            <img src="http://placehold.it/400x266" class="img-rounded"/>
            <p>Semantic e-tailers networks users user-contributed action-items. E-commerce architectures networking envisioneer next-generation</p>
            <p><a class="btn" href="#">View Details &raquo;</a></p>
        </div>
        <div class="span4">
            <h4>000 asdf</h4>
            <img src="http://placehold.it/768x511" class="img-rounded"/>
            <p>Productize e-tailers users redefine e-business synergize bandwidth user-contributed, "front-end reintermediate,"</p>
            <p><a class="btn" href="#">View Details &raquo;</a></p>
        </div>
    </div>
</diV>
4

1 回答 1

3

这是让您入门的一个想法:http: //jsfiddle.net/panchroma/sukH8/

你会看到我指定了一个新类

.imageClip{
width:300px;
height:175px;
overflow:hidden;
}

然后将此类应用于所有图像。您只需要使用 .imageClip 中的高度和宽度来满足您的目的,您还可以通过@media 请求使用不同的值来处理窄屏幕宽度。

希望这可以帮助

于 2013-01-23T17:20:18.843 回答