css把圆圈分成5个扇形

要将一个圆圈分成五个扇形，可以使用CSS的伪元素和旋转变换来实现。首先，创建一个圆形容器，并设置其宽度和高度相等，以达到圆形的效果。接下来，使用CSS的伪元素`::before`和`::after`来创建五个扇形。

给容器设置`position: relative;`，以便在伪元素中使用绝对定位。为了区分扇形，可以使用不同的背景颜色或边框样式。示例如下：

.circle {
  position: relative;
  width: 200px;
  height: 200px;
  border-radius: 50%;
}

.circle::before,
.circle::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 50%;
  border-radius: 100% 100% 0 0;
}

/* 第一个扇形 */
.circle::before {
  background-color: red;
  transform-origin: bottom right;
  transform: rotate(0deg);
}

/* 第二个扇形 */
.circle::after {
  background-color: blue;
  transform-origin: bottom left;
  transform: rotate(72deg);
}

/* 第三个扇形 */
.circle::before {
  background-color: yellow;
  transform-origin: top left;
  transform: rotate(144deg);
}

/* 第四个扇形 */
.circle::after {
  background-color: green;
  transform-origin: top right;
  transform: rotate(216deg);
}

/* 第五个扇形 */
.circle::before {
  background-color: orange;
  transform-origin: bottom center;
  transform: rotate(288deg);
}

这样，一个由五个等分扇形组成的圆圈就可以实现了。可以根据实际需求，自行调整扇形的样式和颜色。注意，`transform-origin`属性用于设置旋转的基点，通过调整旋转角度实现扇形的分割。