今天用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后前端妹子，爱编程，爱运营，文艺与代码齐飞，魅力与智慧共存的程序媛一枚