css3图片模糊处理

最新推荐文章于 2024-04-26 22:25:00 发布

lxl211

最新推荐文章于 2024-04-26 22:25:00 发布

阅读量253

点赞数

分类专栏： css 文章标签： css3 前端 javascript

本文链接：https://blog.csdn.net/lxllxl211/article/details/127282797

版权

css 专栏收录该内容

45 篇文章 0 订阅

订阅专栏

图形模糊处理
语法：
选择器{
filter: blur(15px);
blur里面的数值越大越模糊
}
代码例子：

<style>
        img{
            width: 200px;
            height: 200px;
            display: block;
            filter: blur(15px);
            margin: 200px auto 0;
        }

        img:hover{
            filter: blur(0);
        }
        p{
            
            filter: blur(5px);
        }
        body{
            text-align: center;
        }
        p:hover{
            filter: blur(0);
        }
    </style>
</head>
<body>
    <img src="images/hh.jpg" alt="">
    <p>花花是狗</p>
</body>