<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>制作交通信号灯</title>
<style type="text/css">
*{padding: 0;margin: 0;}
body{background: #FFFFFF;background: url(img/road.jpg) no-repeat;background-size:800px ;}
.box{width: 200px;height: 60px;border: 5px solid #434343;margin: 30px 0 0 300px;border-radius:50px ;background: -webkit-linear-gradient(top,#000,#424242);box-shadow: 0 -5px 10px #333;}
.box div{width: 50px;height: 50px;border-radius:50px ;border: 2px solid #333333;float: left;margin-left: 10px;margin-top: 5px;}
.red{background: -webkit-radial-gradient(#f00,#600);}
.yellow{background: -webkit-radial-gradient(#ff0,#660);}
.green{background: -webkit-radial-gradient(#0f0,#060);}
</style>
</head>
<body>
<div class="box">
<div class="red">
</div>
<div class="yellow">
</div>
<div class="green">
</div>
</div>
</body>
</html>
制作交通信号灯
最新推荐文章于 2020-12-02 12:00:16 发布