今天用CSS写一个缺角的div，大致的效果是这样的，div的左上角和右上角缺掉了一块的效果，简称为缺角div

CSS写一个缺角的div_css

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            .box {
                width: 900px;
                height: 50px;
                background: linear-gradient(-145deg, transparent 11px, #0b2b5f 0) right, linear-gradient(145deg, transparent 11px, #0b2b5f 0) left;
                background-size: 50% 100%;
                background-repeat: no-repeat;
            }
        </style>
    </head>
    <body>
        <div class="box"></div>
    </body>
</html>


作者：祈澈姑娘

90后前端妹子，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的程序媛一枚，欢迎关注【编程微刊】公众号，回复【领取资源】,500G编程学习资源干货免费送。