border-radius programming exercises 1-3

border-radius programming exercises 1-3

We have just learned knowledge rounded corners, so we use a rounded knowledge to achieve the desired effect the following figure:

Reference Code:

<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <title>border-radius案例</title>
  <meta name='description' content='border-radius案例'>
  <meta name='keywords' content='border-radius案例'>
  <style>
    /* 此处写代码 */
    div {
      width: 400px;
      height: 300px;
      border:1px solid red;
      border-radius:20px 10px 60px 10px;
      margin:0 auto;
      
    }
  </style>

  <script>


  </script>

</head>

<body>
  <!-- 此处写代码 -->
  <div></div>

</body>

</html>

  

Guess you like

Origin www.cnblogs.com/f6056/p/11579472.html