我有一个包含文字的图像列表,但我收到的图像有不同的尺寸(全部大于150像素).我需要将它们全部裁剪为150x100px但保持正确的宽高比.有人可以建议解决这个问题的最佳方法吗?谢谢!
HTML:
<ul> <div class="post" id="post"> <div> <li> <img class="TextWrap" src="{{ picture }}"> <a href="{{ link }}">{{ message }}</a><p> {{ time }} </li> </div> </ul>
CSS:
.post { width: 500px; margin-top: 15px; float: left; } .post img { width: 150px; height: 100px; margin-bottom: 15px; margin-right: 20px; } .TextWrap { float: left; }