css的常见伪元素使用

<div class="top">
      <p>可以使用 "first-line" 伪元素向文本的首行设置特殊样式。<br> 换行内容 </p>
    </div>

.top p::first-line {
        color: red;
      }

<div class="top">
      <p>可以使用 "first-letter" 伪元素向文本的首字符设置特殊样式。 </p>
    </div>

.top p::first-letter {
        color: red;
      }

<div class="top">
      <p>可以使用 "before" 伪元素的内容前面插入新内容式。 </p>
    </div>

 .top p::before {
        content: '测试内容 ';
      }

 <div class="top">
      <p>可以使用 "after" 伪元素的内容后面插入新内容式。 </p>
    </div>

   .top p::after {
        content: '测试内容 ';
      }