其他分享
首页 > 其他分享> > css 最简单的淡出淡出

css 最简单的淡出淡出

作者:互联网

 

 

实现的效果,鼠标放上去之后,图片放大。父级div设置宽度高度,并添加 overflow: hidden;

img里面添加 transition: transform 1s;  

 

.imges{       width: 100%;       height: 150px;       overflow: hidden;       img{       width: 100%;       height: 100%;       transition: transform 1s;         }     }   立即学习那个按钮隐藏 .studys {      color: #ffffff;     position: absolute;     bottom: 52%;     left: 30%;     border-radius: 5px;     font-size: 18px;     padding: 8px 40px;     background-color: #188eee;     transition: opacity 1s;    opacity: 0;   }   鼠标放上去时图片放大,然后透明度由0变成1 .imges>img{           transform: scale(1.1)       } .studys {         opacity: 1;          cursor: pointer;       }    

标签:opacity,1s,img,100%,transition,transform,简单,淡出,css
来源: https://www.cnblogs.com/uniapp/p/13203831.html