伪元素器并不是选择HTML结构当中的某个或者某些元素,而是在某个元素的基础之上,去创建一个抽象的元素,而这个元素不在HTML文件内,但浏览器会像普通元素那样对待他,伪元素器就是创建并选择这种元素的选择器

格式为

其他选择器::伪元素 {}

1. 常用伪元素

p::first-letter {  /* 首字母下沉效果 */
  font-size: 2em;
  float: left;
}
::selection {      /* 文本选中样式 */
  background: yellow;
}

2. 内容生成

.tooltip::after {
  content: attr(data-tip);  /* 通过 data 属性生成内容 */
  position: absolute;
  /* 其他定位样式 */
}