css实现笑脸

可以使用CSS的伪元素和伪类来实现一个笑脸。

HTML代码：

<div class="smiley-face"></div>

CSS代码：

.smiley-face {
  width: 200px;
  height: 200px;
  border: 3px solid black;
  border-radius: 50%;
  background-color: yellow;
  position: relative;
}

.smiley-face::before {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  border: 3px solid black;
  border-radius: 50%;
  background-color: white;
  position: absolute;
  top: 30%;
  left: 30%;
}

.smiley-face::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  border: 3px solid black;
  border-radius: 50%;
  background-color: white;
  position: absolute;
  top: 30%;
  right: 30%;
}

.smiley-face::before, .smiley-face::after {
  transform: rotate(45deg);
}

这段代码会创建一个黄色的圆形笑脸，两个白色的圆形眼睛，眼睛使用了伪元素::before和::after来实现。通过调整top和left属性来调整眼睛的位置，通过transform属性来旋转眼睛使其呈现斜角