html - 使缩略图裁剪一半 html

Question

你好，我正在使用 bootstrap3，我有 3 个带图像的内联缩略图，我希望最后一个缩略图被裁剪一半。你们中的一些人能帮我解决这个问题吗？我尝试 overflow hidden 。但是裁剪后的缩略图与正常缩略图的高度变得不一样

我的css是这样的

.imageList{
    display: inline-flex;
    margin-top: 10px
    }

这是我的 js fiddle 的链接 https://jsfiddle.net/px3t08jf/3/

Answer 1

.imageList{
  display: flex;
  width:750px;
  overflow:hidden;
}

.thumbnail {
  flex:0 0 45%;
}

.thumbnail img {
  min-width:300px;
}

.thumbnail.crop-image {
  flex:0 1 10%;
}

https://jsfiddle.net/sjfxL045/

http://autoprefixer.github.io/