兼容所有浏览器的模糊效果代码实例
分类:实例代码
本章节分享一段代码实例,它实现了元素的模糊效果。
并且能够兼容所有浏览器,代码如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.pipipi.net/" /> <title>前端教程网</title> <style type="text/css"> .blur { filter: url(blur.svg#blur); -webkit-filter: blur(10px); -moz-filter: blur(10px); -ms-filter: blur(10px); filter: blur(10px); filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=10, MakeShadow=false); } div { width:200px; height:100px; background:#ccc; } </style> <script> </script> </head> <body> <div class="blur"></div> </body> </html>
一线大厂高级前端编写,前端初中阶面试题,帮助初学者应聘,需要联系微信:javadudu