css伪类-白红宇的个人博客

css伪类

发布日期：2021-09-05 00:32:49 浏览次数：7 分类：技术文章

本文共 691 字，大约阅读时间需要 2 分钟。

　　　　主要说:before,:after元素这俩个伪类元素怎么用，它们和::before,::after没多少区别，后者是css3里新增的。创建一个假的元素盒子，然后添加样式或者内容。而这个盒子就是里面的content样式。使用这个元素里面必须有content样式。看一下它的使用场景：

　　　　1、添加图片或文字

测试
#text::before{content:"";width:100px;height:100px;background:url("xxx.jpg") no-repert center;}这样就在测试前加了一个图片，content用来做盒子但是这个盒子是虚的，所以叫做伪类。

　　　　2、清除浮动　　

#text::after{ content:""; display:block; height:0px; overflow:hidden; clear:both;}

　　　　3、插入文本

#text::after{content:"结尾"；color:"#ccc";}输出测试结尾。#text::before{content:"开始"；color:"#666"}输出开始测试

　　　　4、插入项目编号


         
      标题一
    
      标题二
     
ul li::before{content:(number)"、"；}这里就像是字符串拼接，里面的number可以设置不同的样式值，具体百度吧。

　　　　嗯嗯，以上。

转载于:https://www.cnblogs.com/Grace-zyy/p/8513945.html

转载地址：https://blog.csdn.net/weixin_34228387/article/details/93203551 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！

上一篇：jQuery元素属性操作详解

下一篇：To want to inspire motive, we must first MBT Kisumu

关于作者

喝酒易醉，品茶养心，人生如梦，品茶悟道，何以解忧？唯有杜康！

-- 愿君每日到此一游！