xxx{
background-color: rgba(0,0,0,0.3);
padding-top: 7.6923%;
z-index: 1;
position:relative;
}
xxx:after {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-image:url(模糊後的圖片地址);
background-attachment:fixed;
background-size:cover;
z-index: -1;
}
通過設置background-attachment:fixed; 來使模糊後的背景圖相對網頁固定,然後就能產生模糊效果了,