艾Q网»家园 › Web前端 › CSS+HTML › CSS实现DIV五角星造型

CSS实现DIV五角星造型

要使用CSS创建一个五角星，你可以使用clip-path属性，它允许你定义一个元素的可见区域。以下是创建一个五角星的示例代码：

<style>
  .star {
width: 100px;
height: 100px;
background-color: #f0e68c;
display: inline-block;
clip-path: polygon(
   50% 0%,
   61% 35%,
   98% 35%,
   68% 57%,
   79% 91%,
   50% 70%,
   21% 91%,
   32% 57%,
   2% 35%,
   39% 35%
);
  }
</style>
HTML结构
<body>
  <div class="star"></div>
</body>

使用道具举报