css里面的伪元素主要是用来给选择器设置特殊效果。根据常用性,记录before和after。 “:before”伪元素用来在元素的内容前面添加新的元素。比如标题前面会有一个小方块,就可以通过‘ :before ’来添加。

.title:before{
content:'';
height:30px;
width:4px;
background:#eee;
}

同理,‘ :after ’就是在元素的内容后面添加新元素。

css伪元素之before和after的更多相关文章

  1. jQuery如何改变css伪元素样式

    首先我们看一下css伪元素是什么: CSS 伪元素用于向某些选择器设置特殊效果. 伪元素有哪些: :first-line 伪元素:"first-line" 伪元素用于向文本的首行设 ...

  2. css 伪元素分享!!!

    最近接触到的css 伪元素觉得还算不错 分享下: 1.清楚内盒浮动设置: ;} .back_list ul:after{;visibility: hidden;}/*清楚内盒浮动设置*/ 2.伪元素a ...

  3. CSS伪类与CSS伪元素的区别及由来

    关于两者的区别,其实是很古老的问题.但是时至今日,由于各种网络误传以及一些不负责任的书籍误笔,仍然有相当多的人将伪类与伪元素混为一谈,甚至不乏很多CSS老手.早些年刚入行的时候,我自己也被深深误导,因 ...

  4. (六)CSS伪元素

    CSS伪元素用于向某些选择器设置特殊效果. 伪元素的用法和伪类相似: selector:pseudo-element {property:value;} CSS类也可以与伪元素配合使用: select ...

  5. CSS 伪元素

    CSS伪元素是用来添加一些选择器的特殊效果. 语法 伪元素的语法: selector:pseudo-element {property:value;} CSS类也可以使用伪元素: selector.c ...

  6. css伪元素

    CSS 伪元素用于向某些选择器设置特殊效果. 1.:first-line 伪元素  "first-line" 伪元素用于向文本的首行设置特殊样式.注意:"first-li ...

  7. js如何控制css伪元素内容(before,after)

    曾经遇到的问题,在对抗UC浏览器屏蔽需要把内容输出到css 伪元素中输出.有个疑问如何用js控制它.于是在segmentfault提问,如下是对问题的整理: 如何用js控制css伪类after 简单粗 ...

  8. css伪元素用法大全

    本文主要讲解css伪元素的用法,有需要的朋友可以阅读此文.本文讲解的伪元素有:before,after. 什么是伪元素(Pseudo element)? 伪元素不是真正的元素,不存在与文档之中,所以j ...

  9. js分析 汽_车_之_家 js生成css伪元素 hs_kw44_configUS::before

    0.参考 https://developer.mozilla.org/zh-CN/docs/Web/CSS/Pseudo-elements https://developer.mozilla.org/ ...

  10. CSS伪元素before、after妙用

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. LNMP环境

    准备工作:1)把所有的软件安装在/usr/local/,源码包放在/package/,数据:自定义,日志文件:自定义 创建www所属组及用户/usr/sbin/groupadd www/usr/sbi ...

  2. idea 2018.1 for mac JRebel破解

    第一步: 在 Idea 中下载 Jrebel 路径:preferences-plugins-Browse repositories-直接搜索下载 Jrebel   第二步:配置反向代理工具 1.安装 ...

  3. AbstractQueuedSynchronizer

    1 简介 AbstractQueuedSynchronizer简称AQS是一个抽象同步框架,可以用来实现一个依赖状态的同步器.JDK1.5中提供的java.util.concurrent包中的大多数的 ...

  4. BZOJ1390 CEOI2008 Fences 凸包、Floyd最小环/DP

    传送门 为了方便描述把固定点叫做白色点,Tree叫做黑色点 一种基于特殊性质的做法: 如果不算入选白色的权值,那么一定会选中所有白色点构成的凸包上的点,因为能够尽可能围更多的黑色点.然后我们在这个基础 ...

  5. 实现RunOnUiThread和RunOnUiThreadBlock

    现在需要实现一个工具类,RunUtils,这个类中包含runOnUiThread(Context context, Runnable runnable)和runOnUiThreadBlock(Cont ...

  6. idea 上传代码到 gitee

    https://www.2cto.com/net/201804/740238.html 这一步如果是个空仓库可以提交,如果是个已有的项目 Define remote 一下就可以了,不要提交代码

  7. DOM(三)

    Text类型 文本节点由Text类型表示,包含的是可以照字面解释的纯文本内容,纯文本中可以包含转义后的HTML字符,但不包含HTML代码,Text节点具有以下特征: nodeType值为3: node ...

  8. 第一次在新西兰组织技术社区活动:Monkeyfest2018

    从3月份登陆到现在,转眼间已经8个月了.在6个月的时候我就想写篇文总结下近期的一些状况,一直拖到现在.因为近期一直在筹备我第一次社区活动——Monkeyfest 2018,占用了比较多的时间.这是一个 ...

  9. 腾讯发布新版前端组件框架 Omi,全面拥抱 Web Components

    Omi - 合一 下一代 Web 框架,去万物糟粕,合精华为一 → https://github.com/Tencent/omi 特性 4KB 的代码尺寸,比小更小 顺势而为,顺从浏览器的发展和 AP ...

  10. flask登录插件 flask-login

    Flask-Login为Flask提供了用户会话管理,它处理了日常的登入登出且长时间记住用户的会话 使用: 1.配置,初始化 LoginManager 创建实例 loginManger = Login ...