a div wih all sort of information
從子元素中刪除背景模糊
您有一個
解決方案:建立疊加元素
要實現此目的,您可以在父元素中建立一個單獨的
以下是修改後的 HTML 結構:
a div wih all sort of information
CSS:
.content {
float: left;
width: 100%;
}
.content .overlay {
background-image: url('images/zwemmen.png');
height: 501px;
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
z-index: 0;
}
.opacity {
background-color: rgba(5, 98, 127, 0.9);
height: 100%;
overflow: hidden;
position: relative;
z-index: 10;
}
在此設定中,.overlay 元素應用了模糊效果,而 .opacity 元素阻止此效果到達子元素,從而在模糊背景上產生清晰且聚焦的子元素。
免責聲明: 提供的所有資源部分來自互聯網,如果有侵犯您的版權或其他權益,請說明詳細緣由並提供版權或權益證明然後發到郵箱:[email protected] 我們會在第一時間內為您處理。
Copyright© 2022 湘ICP备2022001581号-3