可以用斜切+旋转

扇形

.pie {

position: relative;

margin: 1em auto;

padding: 0;

width: 32em;

height: 32em;

border-radius: 50%;

list-style: none;

overflow: hidden;

}

.slice {

overflow: hidden;

position: absolute;

top: 0;

right: 0;

width: 50%;

height: 50%;

transform-origin: 0% 100%;

color:#fff;

}

.slice-one {

transform: rotate(30deg) skewY(-30deg);

background: black;

}

.slice-two {

transform: rotate(-30deg) skewY(-30deg);

background: yellow;

}

.slice-three {

transform: rotate(-90deg) skewY(-30deg);

background: black;

}

.slice-four {

transform: rotate(-150deg) skewY(-30deg);

background: yellow;

}

.slice-five {

transform: rotate(-210deg) skewY(-30deg);

background: black;

}

.slice-six {

transform: rotate(-270deg) skewY(-30deg);

background: yellow;

}