主要还是要直到线性渐变怎么写,其他的都是些套路
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
.box {
width: 980px;
height: 60px;
background-color: #000000;
margin: 100px auto;
background-image: linear-gradient(135deg, red 25%, blue 25%, blue 50%, red 50%, red 75%, blue 75%);
background-size: 100px 100px;
animation: move 1s linear infinite;
border-radius: 10px;
}
@keyframes move {
from{
background-position: 0px;
}
to{
background-position: 400px;
}
}
</style>
</head>
<body>
<div class="box">
</div>
</body>
</html>
九层之台 始于垒土
发布了44 篇原创文章 · 获赞 3 · 访问量 830
私信
关注