css中的after怎么使用

CSS中的:after伪元素可以在元素的内容之后插入新的内容

div:after {
  content: "→";
} 

在上面的代码中，我们通过div:after选择器选中了一个div元素，并在其内容之后插入一个箭头字符。

:after伪元素的content属性是必须要设置的。我们可以设置其为文本、图片或其他属性，这取决于我们想要在元素中添加什么内容。

:after伪元素可以应用于任何元素。下面展示了如何将一个圆点添加到一个有序列表的li元素之后:

li:after {
  content: "?";
  padding: 0 5px;
} 

在这个例子中，我们给li元素的:after伪元素添加了一个圆点，并通过padding属性给圆点和li元素之间添加了5px的间距。

值得注意的是，:after伪元素添加的内容不是真正的HTML元素，而是一个虚拟的元素。因此，这些新添加的内容不会影响DOM结构，也不会在屏幕上占据实际的空间。