Div+css综合练习
一、css小动画
这是我学习css之后写的第一个小动画模型哦，看着有点多，但是不难，都是之前学习内容的衍生，想要学习的就来看看叭
别的不说了，代码粘起来，希望可以帮到你！
<style>
#box1{
margin: 0 auto;
width: 500px;
height: 500px;
background-color:rgb(6, 192, 248);
/* position: absolute;
left: 200px; */
}
#box{
width: 100px;
height: 100px;
background-color: red;
animation-name: move;
animation-duration: 3s;
animation-iteration-count: infinite;
animation-direction: alternate;
position: absolute;
top:200px;
}
@keyframes move
{
/* 初始状态 */
0%{
transform: translate(0px,0px);
border-radius: 100%;
}
50%{
transform: translate(200px,0x);
border-radius: 0%;
}
/* 终止状态 */
100%{
transform: translate(400px,0px);
background-color: rgb(216, 151, 12) ;
border-radius: 100%;
}
}
</style>
<body>
<div id="box1">
<div id="box"></div>
</div>
</body>
运行结果图大概就是这样，但是ta是一个小小的动画，会动的哦！复制过去运行一下叭！！！
二、Div+css练习
回归正题，下面要为大家展示的是的一个css的综合练习。
来，author，把代码炸出来：
这个是HTML文件的代码：
<body>
<div id="m-body">
<div id