<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>练习</title>
<link rel="stylesheet" href="./00.css">
</head>
<body>
<div class="cir"></div>
<div class="cir1"></div>
<div class="cir2"></div>
<div class="cir3"></div>
<div class="cir4"></div>
<div class="cir5"></div>
<div class="cir6"></div><br>
<div class="cir7"></div>
<div class="cir8"></div>
<br><br><br><br><br>
<hr>
<div class="cir9"></div>
<div class="cir10"></div>
<div class="cir11"></div>
<div class="cir12"></div>
<br><br><br><br><br><br><br><br><br>
</body>
</html>
cir {
width: 200px;
height: 200px;
background-color: rgb(247, 8, 48);
border-radius: 50% 50%;
}
.cir1 {
width: 200px;
height: 100px;
background-color: rgb(151, 247, 7);
border-radius: 100px 100px 0 0 ;
}
.cir2 {
width: 100px;
height: 200px;
background-color: rgb(117, 189, 8);
border-radius: 100px 0 0 100px ;
}
.cir3 {
width: 100px;
height: 200px;
background-color: rgb(74, 119, 7);
border-radius: 0 100px 100px 0 ;
}
.cir4 {
width: 200px;
height: 100px;
background-color: greenyellow;
border-radius: 0 0 100px 100px ;
}
.cir5 {
width: 100px;
height: 100px;
background-color: aqua;
border-radius: 100% 0 0 0;
}
.cir6 {
width: 100px;
height: 100px;
background-color: rgb(7, 94, 94);
border-radius: 0 100% 0 0;
}
.cir7 {
width: 100px;
height: 100px;
background-color: rgb(1, 49, 49);
border-radius: 0 0 100% 0;
}
.cir8 {
width: 100px;
height: 100px;
background-color: rgb(51, 221, 221);
border-radius:0 0 0 100% ;
}
.cir9 {
width: 0;
height: 0;
border:10px solid rgb(85, 6, 6);
border-color: rgb(17, 97, 97) transparent transparent transparent;
}
.cir10 {
width: 0;
height: 0;
border:10px solid red;
border-color: transparent rgb(100, 145, 11) transparent transparent;
}
.cir11 {
width: 0;
height: 0;
border:10px solid red;
border-color: transparent transparent rgb(100, 87, 9) transparent;
}
.cir12 {
width: 0;
height: 0;
border:10px solid red;
border-color: transparent transparent transparent rgb(159, 164, 167);
}
扫一扫
467
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
