html img取一张图片的中间部分显示,怎样让图片只显示中间的部分？

我的做法是

loadImg (i, e) {

var wrapperWidth = $('.videoPosterContainer').width()

var wrapperHeight = $('.videoPosterContainer').height()

if(e.target.naturalWidth/e.target.naturalHeight - (wrapperWidth/wrapperHeight) > 0){

this.$set(this.videoList[i], 'toWidth', false)

$(e.target).css('transform','translateX(-'+(e.target.width-wrapperWidth)/2+'px)')

}else {

this.$set(this.videoList[i], 'toWidth', true)

$(e.target).css('height', 'auto')

var radio = wrapperWidth/e.target.naturalWidth

$(e.target).css('transform','translateY(-'+(e.target.height*radio-wrapperHeight)/2+'px)')

}

}

css：

.itemImg {

height: 100%;

}

.toWidth {

width: 100%;

height: auto;

}

html：

需要考虑缩略图和你的容器的宽高比，总有一个是撑满的，也就是宽是100%，或者高是100%，然后剩下一个属性就是需要计算的