给图片加上蒙层斜纹效果

admin

撰写于 2022年 08月 14 日

给图片加上蒙层斜纹效果

先看效果图 再看原图 我感觉这个效果图的给人的感觉还不错

再看看原图

是不是感觉效果图的更好看 ，，，fe废话不多说 。下面直接上代码 自己去琢磨

CSS样式

.HeaderImg:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAKUlEQVQImU3IMREAIAgAwJfNkQCEsH8cijjpMf6vnXlQaIiJFx+omEBfmqIEZLe2jzcAAAAASUVORK5CYII=);

}

下面是HTML

   <div class="HeaderImg" style="background: url(图片地址) center; ;;;;background-size:cover;;;;;">
            
            
        </div>