CSS圓圈C的打法

在CSS中，我們可以使用border-radius屬性來繪制一個圓形，如果你想繪制一個帶有C字母的圓形，你可以使用偽元素或者SVG來實現(xiàn)。

方法1：使用偽元素

我們可以使用:before或:after偽元素來在圓形中添加C字母，我們需要創(chuàng)建一個圓形，然后使用偽元素在圓形中添加C字母。

HTML代碼：

<div class="circle-c"></div>

CSS代碼：

.circle-c {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: #ccc;
  position: relative;
}
.circle-c:before {
  content: 'C';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 2em;
  color: #333;
}

方法2：使用SVG

我們可以使用SVG來繪制一個帶有C字母的圓形，我們需要創(chuàng)建一個SVG元素，然后在SVG元素中添加一個圓形和一個C字母。

HTML代碼：

<div class="circle-c">
  <svg width="100" height="100">
    <circle cx="50" cy="50" r="40" fill="#ccc" />
    <text x="50" y="50" font-size="20" fill="#333">C</text>
  </svg>
</div>

CSS代碼：

.circle-c {
  position: relative;
}

兩種方法都可以實現(xiàn)帶有C字母的圓形，你可以根據(jù)自己的需求選擇適合的方法。