首页 前端知识 CSS实现波浪线

CSS实现波浪线

2024-05-20 14:05:16 前端知识 前端哥 541 771 我要收藏

使用css3线性渐变完成波浪线效果

代码如下

   <style>
        div {
            width: 1000px;
            height: 25px;
            background:
                linear-gradient(135deg, transparent, transparent 45%, #333, transparent 55%, transparent 100%),
                linear-gradient(45deg, transparent, transparent 45%, #333, transparent 55%, transparent 100%);
            background-size: 50px 50px;
            background-repeat: repeat-x, repeat-x;
        }
    </style>


<body>
    <div>

    </div>
</body>

实现效果

 

转载请注明出处或者链接地址:https://www.qianduange.cn//article/8923.html
标签
评论
会员中心 联系我 留言建议 回顶部
复制成功!