<div class="diagonal-lines"></div>
/* 斜め線の背景を定義 */
.diagonal-lines {
width: 100%;
height: 100px;
background: linear-gradient(135deg, #ddd 25%, transparent 25%, transparent 50%, #ddd 50%, #ddd 75%, transparent 75%, transparent);
background-size: 20px 20px;
animation: moveDiagonal 5s linear infinite;
}
/* 背景を斜めに移動させるアニメーションを定義 */
@keyframes moveDiagonal {
from {
background-position: 0 0;
}
to {
background-position: 40px 40px;
}
}
斜め線のアニメーション
MORE POSTS