CSS2中的伪类与伪元素
CSS 伪类用于向某些选择器添加特殊的效果。
我们最常见的就是有超链接的时候,向下面这样
a:link {color: #FF0000} /* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */
首先来看一下伪类的定义形式吧
伪类的语法:
selector : pseudo-class {property: value}
CSS 类也可与伪类搭配使用。
selector.class : pseudo-class {property: value}
a.red : visited {color: #FF0000} <a class="red" href="css_syntax.asp">CSS Syntax</a>
我们经常是会用到的伪类如下:
CSS 伪元素用于向某些选择器设置特殊效果。
语法:
伪元素的语法:
selector:pseudo-element {property:value;}
CSS 类也可以与伪元素配合使用:
selector.class:pseudo-element {property:value;}
p.article:first-letter
{
color: #FF0000;
} <p class="article">This is a paragraph in an article。</p>
上面的例子会使所有 class 为 article 的段落的首字母变为红色。
虽然简单,但是容易忘记。。。
CSS2中的伪类与伪元素的更多相关文章
- css中伪类和伪元素的区别
转载:http://www.cnblogs.com/ihardcoder/p/5294927.html CSS3伪类和伪元素的特性和区别 前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常 ...
- CSS3 动态生成内容(在Web中插入内容)====CSS的伪类或者伪元素
# css3 .类:伪类::伪元素 /* CSS3伪元素/伪类 :https://www.w3.org/TR/css3-selectors/#selectors ::selection 伪元素(F12 ...
- CSS中伪类及伪元素用法详解
CSS中伪类及伪元素用法详解 伪类的分类及作用: 注:该表引自W3School教程 伪元素的分类及作用: 接下来让博主通过一些生动的实例(之前的作业或小作品)来说明几种常用伪类的用法和效果,其他的 ...
- 关于css中伪类及伪元素的总结
css中的伪类和伪元素总是混淆,今天参考了很多资料,也查看了部分文档,现将伪类及伪元素总结如下: 一.由来: 伪类和伪元素的引入都是因为在文档树里有些信息无法被充分描述,比如CSS没有"段落 ...
- CSS中的伪类与伪元素
在前端开发中,大家或多或少的有接触过CSS伪类和伪元素,使用伪元素的时候,总感觉和伪类很相似,但又不能详细的说出两者的区别和联系,那么两者到底有什么区别和联系呢? 在 W3C 中定义: 伪类:用于向某 ...
- css中伪类与伪元素的区别
一:伪类:1:定义:css伪类用于向某些选择器添加特殊效果. 伪类其实与普通的css类相类似,可以为已有的元素添加样式,但是他只有处于dom无法描述的状态下才能为文档树中的元素添加样式,所以将其称为伪 ...
- ::before ::after CSS3中的伪类和伪元素
::before和::after伪元素的用法 一.介绍 css3为了区分伪类和伪元素,伪元素采用双冒号写法. 常见伪类——:hover,:link,:active,:target,:not(),:fo ...
- 前端开发 CSS中你所不知道的伪类与伪元素的区别--摘抄
做过前端开发的人都熟悉伪类与伪元素,而真正能够彻底了解这二者的区别的人并不多.伪类与伪元素确实很容易混淆. 伪元素主要是用来创建一些不存在原有dom结构树种的元素,例如:用::before和::aft ...
- 妙味css3课程---1-2、css3中新增的伪类和伪元素有哪些
妙味css3课程---1-2.css3中新增的伪类和伪元素有哪些 一.总结 一句话总结: 1.div:target{}是什么意思? 比如a标签的锚点链接到div,div:target{}就可以找到这个 ...
- css中伪类和伪元素
伪类和伪元素时对那些我们不能通过class.id等选择元素的补充 伪类的操作对象是文档树中已有的元素(可以给已有元素加了一个类替代),而伪元素则创建了一个文档数外的元素(可以添加一个新元素替代) CS ...
随机推荐
- ZOJ 3587 扩展KMP
思路:这题确实大帝做得非常机智!字符串先求最长前缀,反的字符串再求一次最长前缀.然后就能够搞了. 每一个子串出现的次数就是最长前缀的次数嘛! #pragma comment(linker, " ...
- MySQL Cluster管理节点配置文件-数据节点4G内存
自己测试机器上搭建使用,大家可以参考一下 [NDBD DEFAULT] #TotalSendBufferMemory = 256M NoOfReplicas=2 DataMemory=2500M In ...
- java创建线程的三种方式及其对比
第一种方法:继承Thread类,重写run()方法,run()方法代表线程要执行的任务.第二种方法:实现Runnable接口,重写run()方法,run()方法代表线程要执行的任务.第三种方法:实现c ...
- Jacoco的原理(各个覆盖率的解释)
覆盖率计数器 Jacoco使用一系列的不同的计数器来做覆盖率的度量计算.所有这些计数器都是从java的class文件中获取信息,这些class文件可以(可选)包含调试的信息在里面.即使在没有源码的情况 ...
- URI是什么意思?URI和URL有什么区别?
URI是什么意思?URI和URL有什么区别? 详解! HTTP = Hyper Text Transfer ProtocolURI = Universal Resource IdentifierURL ...
- WebStorm配置
一.主题配色 主题设置方法:File -> Settings -> Appearance & Behavior -> Appearance ->Theme. webst ...
- openerp 7.0 来自外部的邮件会发送二次问题解决方法
插入代码:\addons\mail\mail_mail.py #309 line this = self.pool.get('res.users').browse(cr, uid, uid, cont ...
- 动态布局中RadioGroup的RadioButton有时候不相互排斥的原因
近期在做一个答题类的模块,有单选.简答.调查问卷等,我是用动态布局的方式生成答题项的.在弄单选的时候遇到一个比較奇葩的问题,在代码中生成RadioGroup和RadioButton的时候.会发现不能相 ...
- C#:定义窗口快捷键
事情的关键是要设置Form的KeyPreview属性,然后再在KeyDown事件中检查按键. public class TEST : Form { public TEST() { Initialize ...
- 不止是动态化:Weex项目和阿里无线技术开源方向
这是开发者正在书写的峥嵘岁月.受益开源,回馈社区.阿里巴巴集团已经开源115个项目,并正式加入FSF基金会,Apache基金会,linux 基金会和Xen的顾问团队,并在云栖大会北京峰会宣布AliSQ ...