老师，我把云朵实现了，但是不知道下一步怎么做

来源：2-14 项目作业

木子小可爱

2019-08-27 00:35:21

<!DOCTYPE html>
<html>
<head>
   <title></title>
   <meta charset="utf-8">
   <link rel="stylesheet" href="css/index.css" type="text/css">
</head>
<body>
   <div class="sky">
       <div class="cloud1"></div>
       <div class="classloud2"></div>
       <div class="cloud3"></div>
       <div class="cloud4"></div>
       <div class="cloud5"></div>
   </div>
   <div class="grass">
       <div class="rabbit"></div>
   </div>

</body>
</html>

{
   margin:0;
   padding:0;
   width:100%;
   height:100%;
}
.sky{
   width:100%;
   height:60%;
   background-color: rgb(196,228,253);
   background:linear-gradient(to top,white,rgb(196,228,253));
   position:relative;
}
.sky>div{
   width: 308px;
    height: 87px;
    margin-left: 50px;
    margin-top: 100px;
    background: #fff;
    position: relative;
    border-radius: 167px;
    float: left

}
.sky>div:before{
   content: '';
    width: 150px;
    height: 100px;
    top: -13px;
    left: 28px;
    border: 1px solid white;
    background: white;
    position: absolute;
    border-radius: 60px;
    transform: rotate(55deg);
}
.sky>div:after{
    content: '';
    width: 175px;
    height: 175px;
    top: -70px;
    left: 99px;
    border: 1px solid white;
    background: white;
    position: absolute;
    border-radius: 100px;
}
.grass{
   width:100%;
   height:100%;
   background:linear-gradient(to bottom,white,rgb(148,190,89));
}