CSS：圆有四种颜色，只有一个div
问题描述：
是否可以使用纯CSS为四个不同颜色（每个季度一个）创建一个圆圈？
我想要这四个圈子之一：
Is it possible to create a circle with four different colors (one for each quarter) using pure CSS? I want something like one of these four circles:
我可以想象使用具有四个div和border-radius的解决方案，但是这是可能只使用一个div和一些花哨的css3？
I can imagine using a solution with four divs and border-radius, but is this possible using only one div and some fancy css3?
答
你列出CSS3，你可以使用边框和旋转变换来修复对齐方式：
Since you listed CSS3, you could do this with just borders and a rotation transformation to "fix" the alignment:
div {
border-radius: 50px;
border-style: solid;
border-width: 50px;
border-bottom-color: red;
border-left-color: green;
border-right-color: blue;
border-top-color: yellow;
height: 0px;
width: 0px;
/* To ratate */
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}