Question

我的图像尺寸不同，我想像这样https://imgur.com/a/9v76Kyj那样在div中调整所有图像。目前，我使用此代码获得了https://imgur.com/a/pOJnIRh

#box-image-div{
  /* Prevent vertical gaps */
  line-height: 0;

  -webkit-column-count: 20;
  -webkit-column-gap:   0px;
  -moz-column-count:    20;
  -moz-column-gap:      0px;
  column-count:         20;
  column-gap:           0px;  
}

#box-image-div img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}


<div id="box-image-div">


<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/112.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/118.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/113.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/115.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/114.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/116.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/117.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/115.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/114.png">
<img class="box-image" src="http://sty1.stallyons.com/advertising/wp-content/uploads/2018/09/116.png">



</div>

使用引导程序调整彼此大小不同的图像

0 个答案: