CSS基础教程:CSS的Pseudo Classes 伪类

2016-02-19 13:40 1 1 收藏

图老师小编精心整理的CSS基础教程:CSS的Pseudo Classes 伪类希望大家喜欢,觉得好的亲们记得收藏起来哦!您的支持就是小编更新的动力~

【 tulaoshi.com - Web开发 】

请你注意一些CSS伪类属性不被所有浏览器支持,但有四个伪类可以安全使用在链接上

  伪类像是指定选择器状态或关联选择器的门闩。它们的形式如:selector:pseudo class { property: value; },在选择器和伪属性之间使用冒号。

  link 没有点击过的链接 
  visited以点击过的链接 
  active获得焦点时的链接(比如在点击时) 
  hover 鼠标在链接上面
a.snowman:link {
    color: blue;
}
a.snowman:visited {
    color: purple;
}
a.snowman:active {
    color: red;
}
a.snowman:hover {
    text-decoration: none;
    color: blue;
    background-color: yellow;
}
  尽管CSS里可以省略它们,但维护不同颜色的链接对于新手是个很好的练习。由于伪类(相比hover)不是经常使用,作为公用属性是非常不幸的特性。由于这样,它不像以前那么重要,但如果为最优用户响应考虑,应该使用它。

  传统默认,文本链接是蓝色,访问后是紫色,理论上可以使用很多不同颜色效果,但,再次,逐渐广泛使用CSS,使得链接变得不再普通,平均用户也不再认为链接必须是蓝色或紫色。

  除了链接其他元素也可以使用hover伪类。不幸的是,ie7以下的浏览器不支持,这样有许多漂亮的效果不能在IE上实现。

来源:https://www.tulaoshi.com/n/20160219/1604907.html

延伸阅读
标签: Web开发
CSS Borders 边框 边框可以运用到body里的大部分HTML元素。  制作一个元素的边框,你需要border-style边框样式。值可以是: solid, dotted, dashed, double, groove, ridge, inset and outset,具体样式大家可以实际下。 border-width设定宽度,通常使用pixels即单...
标签: Web开发
Grouping 分组 当许多选择器有同样属性时,可以使用逗号组合它们。 例子: h2 {     color: red; } .thisOtherClass {     color: red; } .yetAnotherClass {     color: red; } 上面的可以写成这样: h2, .thisOtherCl...
标签: Web开发
  本教程假设您没有任何样式表语言的基础,甚至,您可以完全不知道是什么东东,但是,我们同样假设您已经掌握了基本的语法。比如,您肯定知道是表明页面的头部,是表示页面的一个段落。     、正式开始学习之前的几句啰嗦话: l        不是什么高深的东东,它的编写...
标签: Web开发
margin和padding用来隔开元素,margin是隔开元素与外边,padding是隔开元素里边。 例子h2: h2 {     font-size: 1.5em;     background-color: #ccc;     margin: 1em;     padding: 3em; } 元素四边可以设置的属性:mar...
标签: Web开发
在CSS网页布局中,不可避免的会涉及到CSS伪类的问题。到底该如何正确的定义CSS伪类呢?虽然webjx中有很多相关的介绍,但复习一下也无妨。大家看下面的代码就能明白。 a.webjxcom{text-decoration:none;} a.webjxcom:link{color:#f90;} a.webjxcom:hover{color:#fff;background-color:#FF5900;} a.webjxcom:active{color:#FF5900;} a href=&...

经验教程

298

收藏

98
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部