html--花瓣

代码

<!DOCTYPE html>
<html lang="en" >

<head>
<meta charset="UTF-8">
<title>Petals</title>



  <link rel="stylesheet" href="css/style.css">


</head>

<body>

  
<div class="mandala"> 
  <div class="flower">
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="whorl"></div>
  </div>
  <div class="flower">
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="whorl"></div>
  </div>
  <div class="flower">
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="whorl"></div>
  </div>
  <div class="flower">
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="petal"> </div>
    <div class="whorl"></div>
  </div>
</div>
  
  

</body>

</html>