css伪元素可以用来干啥?

伪元素已经不是什么新东东了,平时大家在实际生产中肯定有使用过伪元素。但伪元素能帮助我们做些什么呢?

伪元素是什么

元素事实上是HTML中的概念,常常把HTML中的标签称作为元素。那么伪元素是什么呢?从其名称上来说,伪即为假,在实际的DOM中是不存在的,而事实上呢?我们可以借助一些CSS的特性让其模拟成一个元素,对于这样的元素我们称之为伪元素。

css伪元素可以用来干啥?

CSS 伪元素用于向某些选择器设置特殊效果;可以选中元素的特定位置,并应用样式

伪元素是对指定文档之外的抽象,比如,文档设计不能访问元素中的第一个字和第一行的机制,就会使用伪元素去引用它们,还可以给不存在的内容进行添加样式。

CSS中常见的伪元素有:first-line, :first-letter, :before, :after;

伪元素表示位置
first-letter第一个字符
first-line第一行
before元素前
after元素后

如何使用伪元素?

css的伪元素是使用两个冒号,是为了和其他伪类区别开来。

伪元素的语法:

selector:pseudo-element {property:value;}
选择器:伪类{ CSS样式 }

选择器选中的元素,伪元素表示要在该元素的哪里应用样式。

CSS 类也可以与伪元素配合使用:

selector.class:pseudo-element {property:value;}

示例:

hey::before{}
hey::after{}

更多web前端开发知识,请查阅 HTML中文网 !!

以上就是css伪元素可以用来干啥?的详细内容,更多请关注易知道|edz.cc其它相关文章!

推荐阅读