<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<!--<link rel="stylesheet" type="text/css" href="../css/yanse.css">-->
<style>
.big{
width:400px;
height:400px;
background:sandybrown;
margin:auto;
position:relative;
}
.ddd{
width:60px;
height:250px;
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
overflow:hidden;
}
.small{
width:60px;
height:25000px;
background:repeating-linear-gradient(45deg, white,white 15px,black 15px,black 30px);
position:absolute;
top:0;
left:0;
right:0;
bottom:0;
margin:auto;
transition:all 50s linear;
}
.small:hover{
transform:translateY(10000px);
}
</style>
</head>
<body>
<div class="big">
<div class="ddd">
<div class="small"></div>
</div>
</div>
</body>
</html>
demo-1-颜色渐变
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。
