css虚线

作者: 无忧花开_6e92 | 来源:发表于2023-10-06 17:27 被阅读0次

    <!DOCTYPE html>
    <html lang="en">

    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>虚线</title>
    <style>
    .line {
    background: -webkit-linear-gradient(to left, transparent 0%, transparent 50%, #D0D7E6 50%, #D0D7E6 100%);
    background: -moz-linear-gradient(to left, transparent 0%, transparent 50%, #D0D7E6 50%, #D0D7E6 100%);
    background: -o-linear-gradient(to left, transparent 0%, transparent 50%, #D0D7E6 50%, #D0D7E6 100%);
    background: -ms-linear-gradient(to left, transparent 0%, transparent 50%, #D0D7E6 50%, #D0D7E6 100%);
    background: linear-gradient(to left, transparent 0%, transparent 50%, #D0D7E6 50%, #D0D7E6 100%);
    background-size: 20px 2px;
    background-repeat: repeat-x;
    padding: 10px;
    }
    </style>
    </head>

    <body>
    <div class="box line"> </div>
    </body>

    </html>


    效果图.png

    相关文章

      网友评论

        本文标题:css虚线

        本文链接:https://www.haomeiwen.com/subject/vpxmbdtx.html