CSS中伪元素之前和之后的使用方法 - 行业资讯 - 肥雀云

　　介绍

这篇文章主要介绍CSS中伪元素之前和之后的使用方法,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!

<强>::和::后是什么?

之前和之后的描述如下

元素::之前{内容:插入的内容;} 　　后元素:{内容:插入的内容;}

内容:输入要插入的部分内容

要在内容中插入字母和符号,请用" "括起来并输入。
要在内容中插入图像和声音,请输入url(目标路径)。

也可以为同一元素指定之前和之后。

CSS3中之前和之后等伪元素使用::(双冒号),但即使只有一个冒号,它在大多数浏览器中也能识别并正常工作。

<强>支持的浏览器

支持::和::后伪元素的浏览器:Chrome, Firefox3.5 ~, Safari4 ~, IE8 ~, Opera6 ~。

<>强如何使用伪元素之前和之后?

下面是一个应用之前和之后的HTML文件
(这是* HTML和css文件位于同一目录且外部样式表的文件名”为样本。css”的示例)

HTML

& lt; !DOCTYPE html> 　　& lt; html> 　　& lt; head> 　　& lt;元charset=皍tf-8"/比; 　　& lt;链接rel=皊tylesheet"href=https://www.yisu.com/zixun/sample.css " type=" text/css "> 　　头　　<身体> 　　

标题前加入标记

段落前插入图像

　　身体　　

样本。css

 
 以下是在同一元素上同时使用之前和之后的示例。
  & lt; !DOCTYPE html>
　　& lt; html>
　　& lt; head>
　　& lt;元charset=皍tf-8"/比;
　　& lt;链接rel=皊tylesheet"href=https://www.yisu.com/zixun/sample.css " type=" text/css ">
　　头
　　<身体>
　　在标题之前和之后加入标记
　　段落后插入图像
　　身体

样本。css

<强>最后解释一下关于冒号的数量

有两种伪元素,:/:前和后::/::。

在css2中,写一个冒号,如:/:之前。

在css3中,写两个冒号,例如,::/::。

由于css3是最新的CSS,因此也可以说伪元素是:前/::。

对于::/::之后,主浏览器兼容。

但是,应该注意的是,css3的一部分语法与主浏览器并不兼容。

以上是CSS中伪元素之前和之后的使用方法的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注行业资讯频道!