Html 用CSS绘制半圆形图形

我试着复制这个形状

当我在CSS中使用圆形时，它看起来有些不同：

.shape{
显示：内联块；
文本对齐：居中；
线高：18px；
边界半径：9px 9px 9px 9px；
颜色：#000000；
左侧填充：6px；
右边填充：6px；
字体大小：粗体；
字体系列：无衬线；
}
.形状.橙色{
背景色：#FF931B；
}

---

CC6

这可以使用

径向梯度来完成


.shape{
显示：内联块；
字体大小：50px；
线高：1.5em；
填充：0.4em；
字体大小：粗体；
字体系列：无衬线；
背景：
径向梯度（100%50%在右侧，#FF931B 98%，透明100%）在左侧，
径向梯度（左侧100%50%，右侧#FF931B 98%，透明100%），
#FF931B内容框；/*不要对填充物上色以保持径向渐变*/
背景尺寸：0.4em 100%；/*宽度与填充相同，高度100%*/
背景重复：无重复；
}
CC6
CC6
CC6