我想嵌入默认情况下使用 CSS 进行模糊处理的图像(源图像文件未进行模糊处理)。当用户将鼠标悬停在图像上时,应该显示该图像。如果它上面也有动画,那就太棒了。有什么办法吗?
最佳答案
CSS filters (MDN 引用)可以做到这一点
img {
-webkit-filter: blur(10px);
filter: blur(10px);
-webkit-transition: -webkit-filter .5s linear;
transition: -webkit-filter .5s linear;
transition: filter .5s linear;
transition: filter .5s linear, -webkit-filter .5s linear;
}
img:hover {
-webkit-filter: blur(0);
filter: blur(0)
}
<img src="http://www.fillmurray.com/460/300" alt="" />
关于css - 默认模糊图像,悬停时显示?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38593473/