1、CSS 伪元素用于向某些选择器设置特殊效果(用来当作一个东西的,跟一个元素差不多,但不是元素)。
① :frist-line伪元素:用于向文本首行设置特殊样式,但是只能用于块级元素。
以下属性可应用于 “ frist-line ” 伪元素:
font、color、background、word-spacing、letter-spacing、text-decoration、vertical-align、text-transform、line-height、clear 。
② :first-letter伪元素:用于向文本首字母设置特殊样式,只能用于块级元素。
以下属性可应用于 “ first-letter ” 伪元素:
font、color、background、margin、padding、border、text-decoration、vertical-align(仅当float为none时)、text-transform、line-height、float、clear 。
③ 伪元素和css类可以配合使用:p.article: first-letter { },可以使所有 class 为 article 的段落的首字母样式改变 。
④ 多重伪元素:可以结合多个伪元素来使用。p: first-letter { },p: first-line { }:段落的第一个字母根据p: first-letter具体样式显示,第一行其余文本根据p: first-line具体样式显示,段落中其余文本以具体段落设置的其他样式显示。
⑤ :before伪元素:可以在元素内容前面插入新内容 。
⑥ :after伪元素:可以在元素的内容之后插入新内容 。
⑦ 许多人喜欢给 blockquote 引用段添加巨大的引号作为背景,这种时候我们就可以用 :before 来代替 background 了,既可以给背景留下空间,还可以直接使用文字而非图片:
blockquote::before
延伸阅读
- ssh框架
2016-09-30
- 阿里移动安全 [无线安全]玩转无线电——不安全的蓝牙锁
2017-07-26
- 消息队列NetMQ 原理分析4-Socket、Session、Option和Pipe
2024-03-26
- Selective Search for Object Recognition 论文笔记【图片目标分割】
2017-07-26
- 词向量-LRWE模型-更好地识别反义词同义词
2017-07-26
- 从栈不平衡问题 理解 calling convention
2017-07-26
- php imagemagick 处理 图片剪切、压缩、合并、插入文本、背景色透明
2017-07-26
- Swift实现JSON转Model - HandyJSON使用讲解
2017-07-26
- 阿里移动安全 Android端恶意锁屏勒索应用分析
2017-07-26
- 集合结合数据结构来看看(二)
2017-07-26
学习是年轻人改变自己的最好方式