logo竹子建站
自助建站小技巧:鼠标悬停图片放大效果怎样实现
2023-04-21 17:02:16
很多用户想丰富自己的图片效果,有的组件有实现不了用户想要的效果,小编为各位提供有关鼠标悬停图片放大的操作步骤。各位亲们都操作起来哦!
在图文组件中,我们可以用代码来实现我们鼠标悬停图片放大的效果展示给我们的客户。
首先把代码给各位亲们放置在此:
._114htuui90007 .zz-comp-list__item .img img{
transition: all 0.3s ease-out;
}
._114htuui90007 .zz-comp-list__item:hover .img img{
transform: scale(1.2);
}
接下来我们如下图所示进行操作:
 
1、添加图文组件:
 
2、点击我们的图文组件的设置
 
3、进入图文设置--点击代码--编辑组件代码--输入代码--进行ID的替换--应用--保存即可
4、最后效果如下: