<template>
<view>
<view class='container'>
<view class='frosted-glass'></view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style lang="scss">
.container{
width: 100%;height: 300px;
position: relative;
background-image: url('base64');
// background-image: url('~@/static/workplatform/maoboli_bg2.jpg');
background-position: center top;
background-size: cover;
}
.frosted-glass{
width: 100%;height: 70%;
background: inherit;
-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-ms-filter: blur(5px);
-o-filter: blur(5px);
filter: blur(10px); //此处可以修改模糊度
filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=4, MakeShadow=false);
box-shadow: 0 1px 1px white;
}
</style>
