如何用CSS给HTML添加新元素

在CSS中，我们可以使用伪元素 ::before 和 ::after 来增加元素。这些伪元素本质上是添加到选择器中的额外内容，可以用来添加一些文本、图片或其他元素。

以下是一些示例：

使用 ::before 添加内容：
p::before {
  content: "在段落前添加的内容";
}

使用 ::after 添加内容：
p::after {
  content: "在段落后添加的内容";
}

使用 ::before 添加图片：
div::before {
  content: url("image.jpg");
}

使用 ::after 添加图片：
div::after {
  content: url("image.jpg");
}
注意：content 属性是必须的，它指定了要添加的内容。如果不需要添加内容，可以设置为空字符串 content: "";。

使用 ::before 和 ::after 添加多个元素：

div::before, div::after {
  content: "";
  display: block;
  width: 50px;
  height: 50px;
  background-color: red;
}

div::after {
  content: "";
  display: block;
  width: 100px;
  height: 100px;
  background-color: blue;
}
在这个例子中，我们在 div 元素前添加了一个红色的小方块，在 div 元素后添加了一个蓝色的大方块。

以上就是在CSS中添加元素的一些基本方法。