css ::after

作者：傲世，小狂徒发布日期:2025-08-14 浏览:95

/* 示例代码：使用 ::after 伪元素 */

/* 基本用法 */
p::after {
  content: " - 这是添加的内容";
  color: red;
}

/* 添加图标 */
.icon::after {
  content: url('icon.png');
}

/* 创建一个清除浮动的类 */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

/* 解释说明：
- ::after 伪元素用于在元素的内容之后插入生成内容。
- content 属性是必须的，它指定了要插入的内容。可以是文本、URL（如图片）、引号等。
- 在上面的例子中，第一个例子是在段落 p 的内容后添加了一段红色的文字；
  第二个例子是在具有 .icon 类的元素后添加了一个图标；
  第三个例子展示了如何使用 ::after 来清除浮动，这是一个常见的布局技巧。
*/

上一篇：css文本垂直居中

下一篇：cssdisplay属性