css实现简单背景模糊的方法

　　css样式：

　　<styletype="text/css">

　　.cover{

　　width:600px;

　　height:300px;

　　position:relative;

　　text-align:center;

　　line-height:300px;

　　color:#fff;

　　margin:20pxauto;

　　}

　　.cover::before{

　　content:"";

　　position:absolute;

　　top:0;

　　left:0;

　　width:600px;

　　height:300px;

　　background:transparenturl(Images/picture/5.jpg)centercenterno-repeat;

　　filter:blur(8px);

　　z-index:-1;

　　background-size:cover;

　　}

　　</style>

　　HTML结构：

　　<body>

　　<pclass="cover">

　　<h2>背景模糊，文字清晰显示</h2>

　　</p>

　　</body>

本文转载自中文网

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/css3-style/c56730.shtml