css::before ,::after伪元素

其将成为匹配选中的元素的第一个子元素。常通过 content 属性来为一个元素添加修饰性的内容。此元素默认为行内元素。

/* Add a heart before links */
a::before {
  content: "♥";
}

我觉得不用再说啥了。直接上图和代码就行了

p::before {
  content: "<";
  color: red;
}
p::after {
  content: ">";
  color: red;
}

<p>asdfasf</p>

会分别在文段的左右加上红色的括号