引导程序中的硬代码图像大小

Question

我正在从我网站上的网页上检索图片。用户将图像上传到站点。我希望这些图像在屏幕上均匀显示，就像您在eventbrite上以表格形式看到的那样。但现在，我的代码读取上传图像的大小，并根据图像更改容器的大小，并导致布局不佳，如下所示：

如何才能使每个图像硬编码为360x220？

这是我目前的代码：

   <div class="container">
     <div class="row">
       <div class="col-xs-4">
         <div class="thumbnail">
           //image goes here
         </div>
      </div>
    </div>
 </div>

我尝试查看bootstrap.css文件，并将其更改为：

        .img-thumbnail {
           display: inline-block;
           width: 360;
           max-width: 100%;
           height: 220;
           padding: 4px;
           line-height: 1.42857143;
           background-color: #fff;
           border: 1px solid #ddd;
           border-radius: 4px;
        -webkit-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;

}

但这也不起作用。

Answer 1

你没有以正确的格式将px放在宽度和高度上作为更改

.img-thumbnail 
{
width: 360px;
height: 220px;
}

可以帮到你