<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
        .box1{width: 80px;
        height: 100px;
        border: 10px solid black;
        border-radius: 60%;

        }
        .box2{
            width: 100px;
            height: 50px;
            border: 10px solid black;
            border-radius: 40%;
        }
        .box3{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 60% 20% 60% 20%;
        }
        .box4{
            width: 100px;
            height: 50px;
            border: 10px solid black;
            border-radius: 10% 60% 10% 60%;
        }
        .box5
        {
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 0% 50% 50% 50%;
        }
        .box6{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 0% 0% 0% 50%;
        }
        .box7{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 0% 0% 0% 30%;
        }
        .box8{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 10% 10% 10% 10%;
        }
        .box9{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 10% 20% 50% 50%;
        }
         .box10{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 40% 60% 0% 20%;
        }
        .box11{
            width: 100px;
            height: 100px;
            border: 10px solid black;
            border-radius: 10% 10% 60% 20%;
        }
        
        </style>
    </head>

    <body>
        <div class="box1"></div>
        <div class="box2"></div>
        <div class="box3"></div>
        <div class="box4"></div>
        <div class="box5"></div>
        <div class="box6"></div>
        <div class="box7"></div>
        <div class="box8"></div>
        <div class="box9"></div>
        <div class="box10"></div>
        <div class="box11"></div>
        
    </body>
</html>

css画圆.png