CSS模拟hover时图片只显示一半的动画解决方案

1、下面的部分用白底div来装，hover时改变div的高

2、使用图片剪裁

position: absolute;

clip: rect(0px,380px,150px,0px);  /* 剪裁成矩形尺寸为 rect (top, right, bottom, left)*/

.menu4__items:hover .menu4__items__icon{

/* height: 160px;

width: 380px; */

/*clip可以显示*/

position: absolute;

clip: rect(0px,380px,150px,0px);

left: 0;

}

3、学习新概念CSS3 object-position/object-fit图片处理<img>

https://www.zhangxinxu.com/wordpress/2015/03/css3-object-position-object-fit/