css圆圈里面放文字

在CSS中，我们可以通过border-radius属性来创造圆形的形状，而如果我们想在这个圆形的内部放置文字，该怎么做呢？

我们可以先创建一个div元素，并通过CSS设置它的宽度和高度为一样大的值，从而创造出一个正方形的元素。接着，我们使用border-radius属性将这个正方形的四角变成圆角，就可以得到一个圆形的元素了。

div {
  width: 100px;
  height: 100px;
  border-radius: 50%; /* 将四角变为圆角 */
}

接下来，我们要在这个圆形元素的内部放置文字。这可以通过设置元素的line-height属性来实现，在这个属性设定的高度内，我们可以将文字居中放置。

div {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  line-height: 100px;
  text-align: center; /* 水平居中 */
  vertical-align: middle; /* 垂直居中 */
}

另外，我们还可以使用CSS中的text-shadow属性来为文字添加阴影效果，从而让文字更加突出。

div {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  line-height: 100px;
  text-align: center;
  vertical-align: middle;
  text-shadow: 1px 1px 1px #000; /* 添加文字阴影 */
}

通过以上的代码，我们就可以在圆形元素内部放置文字，并使用text-shadow属性为文字添加阴影效果了。