css 实现条纹背景效果

css 实现条纹背景效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-afpF5YHe-1633685072007)(https://ws4.sinaimg.cn/large/006tNbRwgy1fukns5yeegj308p0e4dgk.jpg)]

HTML

  <div class="stripe"></div>

CSS

body{
    background-color: rgb(23,13,63)
}
.stripe{
    width: 300px;
    height: 500px;
    background: linear-gradient(rgba(63,171,255,.5) 50%, transparent 50%);
    background-size: 100% 8px;
    box-shadow: 0px 0px 100px -10px #fff inset
}