创建像圆圈一样的披萨

Question

有没有办法使用JavaScript或CSS3创建一个缺少片段的圆圈,如图片？

Answer 1

请在下面找到代码。

#myshape
     { 
         width: 0px; height: 0px;
         border-right: 60px solid transparent;
         border-top: 60px solid red;
         border-left: 60px solid red;
         border-bottom: 60px solid red;
         border-top-left-radius: 60px;
         border-top-right-radius: 60px; 
        border-bottom-left-radius: 60px; 
        border-bottom-right-radius: 60px; 
}

另一种解决方案是使用两个形状，首先创建一个圆形，然后在其上放置一个窄三角形（使三角形的颜色为白色，圆形为绿色），对于窄三角形，您可以使用此代码

.narrowtriangle
{
    width: 0;
    height: 0;
    text-indent: -9999px;
    border-right: 40px solid transparent;
    border-bottom: 100px solid #f09;
    border-left: 150px solid transparent;
}

对于圆圈，你可以使用这个

 #circle { 
   width: 140px;
   height: 140px;
   background: red; 
   -moz-border-radius: 70px; 
   -webkit-border-radius: 70px; 
   border-radius: 70px;
}