Div Css

CSS3 transform 属性值 scale 放大缩小后变模糊的解决办法

来源：锦绣园 2017-09-01 09:30:485105

CSS3 transform 属性值 scale 放大缩小后变模糊的解决办法：


transform 属性 scale 缩放动画代码如下，在鼠标经过hover代码加入 transform:translateZ(0) 就可以了。

<style>

.img_box{ width:200px; height:200px; overflow:hidden;} 

.img_box img{ width: 100%; transform:translateZ(0) scale(1); transition: all .8s;}     /*缩小后不会变模糊*/

.img_box img:hover{ transform:translateZ(0) scale(1.1);}    /*放大后不会变模糊*/

</style>

<div class="img_box">

    <img src="img.jpg">

</div>


文章推荐