简介:伪类(Pseudo classes)是选择符的螺栓,用来指定一个或者与其相关的选择符的状态。它们的形式是selector:pseudo class { property: value; },简单地用一个半角英文冒号(:)来隔开选择符和伪类。CSS很多的建议并没有得到浏览器的支持,但有四个可以安全用在超链接上的伪类。

:link用在未访问的连接上。

:visited用在已经访问过的连接上。

:active用于获得焦点(比如,被点击)的连接上。

:hover 用于鼠标光标置于其上的连接。

应用场景:比如a标签在不同状态下显示不同的颜色

a:link {color: #FF0000}
a:visited {color: #00FF00}
a:hover {color: #FF00FF}
a:active {color: #0000FF}

需要注意

提示:在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。

提示:在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。

提示:伪类名称对大小写不敏感。

另外还有一些常见的如:first-child(应用场景如li的第一个元素和其它元素的样式不同时)

参考

1.http://www.w3school.com.cn/css/css_pseudo_classes.asp

css伪类(Pseudo-classes)的更多相关文章

  1. 谈谈css伪类与伪元素

    前端er们大都或多或少地接触过CSS伪类和伪元素,比如最常见的:focus.:hover以及<a>标签的:link.:visited等,伪元素较常见的比如:before.:after等. ...

  2. [转] 用javascript修改css伪类的几种方法

    用javascript修改css伪类的几种方法: Modify pseudo element styles with JavaScript http://pankajparashar.com/post ...

  3. CSS伪类和伪元素

    一.伪类 CSS伪类用于向某些选择器添加特殊的效果,在W3规范中,CSS伪类有如下几个: CSS2.1 :active:向被激活的元素添加样式(激活是指点击鼠标那一下) :focus:向拥有键盘输入焦 ...

  4. CSS 伪类 (Pseudo-classes)

    CSS 伪类用于向某些选择器添加特殊的效果. CSS 伪类 (Pseudo-classes)实例: 超链接 本例演示如何向文档中的超链接添加不同的颜色. 超链接 2 本例演示如何向超链接添加其他样式. ...

  5. CSS伪类选择器

    一.CSS伪类选择器用于给某些选择器添加效果语法规则:选择器:伪选择器例:a:link {color: #FF0000} 未访问的链接 a:visited {color: #00FF00} 已访问的链 ...

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

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

  7. CSS 伪类

    Link The :link CSS pseudo-class lets you select links inside elements. This will select any link whi ...

  8. CSS伪类

    CSS伪类:控制元素的某种状态 语法:元素名称:伪类名称{属性:值} CSS伪类控制链接状态 状态 语法 未访问的链接 a:link{color:#ff00ff} 已访问的链接 a:visited{c ...

  9. 应用越来越广泛的css伪类

    说起css伪类,学习web前端网页设计的同学们应该对此应该不是很陌生,以前很多的网页的特效大多是通过js来实现的.但是随着CSS3不断开发,利用css实现网页的特效不仅响应不错,而且还减少了很多的代码 ...

  10. (五)CSS伪类(Pseudo-class)

    CSS伪类用于向某些选择器添加特殊的效果.伪类的语法如下: selector : pseudo-class {property: value} CSS类也可以与伪类搭配使用: selector.cla ...

随机推荐

  1. 人生苦短之我用Python篇(队列、生产者和消费者模型)

    队列: queue.Queue(maxsize=0) #先入先出 queue.LifoQueue(maxsize=0) #last in fisrt out  queue.PriorityQueue( ...

  2. 機器學習基石 机器学习基石(Machine Learning Foundations) 作业2 第10题 解答

    由于前面分享的几篇博客已经把其他题的解决方法给出了链接,而这道题并没有,于是这里分享一下: 原题: 这题说白了就是求一个二维平面上的数据用决策树来分开,这就是说平面上的点只能画横竖两个线就要把所有的点 ...

  3. Failed to read schema document

    转自:http://eric-yan.iteye.com/blog/1908470 问题描述: web项目web.xml编译错误: schema_reference.4: Failed to read ...

  4. selenium-java,启动谷歌浏览器和火狐浏览器

    selenium3.4.0-java,启动谷歌浏览器和火狐浏览器-------------------------------------------------------------------- ...

  5. BZOJ4976:宝石镶嵌(DP&思维)

    Description 魔法师小Q拥有n个宝石,每个宝石的魔力依次为w_1,w_2,...,w_n.他想把这些宝石镶嵌到自己的法杖上,来提升 法杖的威力.不幸的是,小Q的法杖上宝石镶嵌栏太少了,他必须 ...

  6. HDU - 5876 :Sparse Graph (完全图的补图的最短路 -BFS&set)

    In graph theory, the complement of a graph G is a graph H on the same vertices such that two distinc ...

  7. python笔记-9(subprocess模块、面向对象、socket入门)

    一.subprocess 模块 1.了解os.system()与os.popen的区别及不足 1.1 os.system()可以执行系统指令,将结果直接输出到屏幕,同时可以将指令是否执行成功的状态赋值 ...

  8. 让thinkphp 5 支持pathinfo 的 nginx ,去掉index.php

    在TP5.0中查阅tp5官方文档,注意:5.0取消了URL模式的概念,并且普通模式的URL访问不再支持.phthinfo 是什么? PHP中的全局变量$_SERVER['PATH_INFO']是一个很 ...

  9. MSDN中回调函数的讲解及其C#例子:用委托实现回调函数

    转自:http://blog.csdn.net/sizheng0320/article/details/1615777 ms-help://MS.MSDNQTR.2003FEB.2052/cpguid ...

  10. js中对数字进行正则判断

    <script type="text/javascript"> function SubmitCk(num) { var reg = /^([a-zA-Z0-9]+[_ ...