如何使用CSS 伪类
的有关信息介绍如下:我们在实际的应用当中会出现要向特殊的选择器增加效果的需求,这就是CSS 伪类现象,要掌握这样的一个语句也是不难的,我们来一一学习好了。
超链接。对于网页中的超链接来说,不同的使用状态是有着不同外观的,这用CSS语句来实现也是不难的。
a:link {color: #FF0000}
a:visited {color: #00FF00}
a:hover {color: #FF00FF}
a:active {color: #0000FF}
更多效果。其实,我们可以通过CSS语句来实现更多的超链接效果,这也是非常简单的。但一定要注意不同CSS语句之间的对应次序关系,不能搞错。
a.one:link {color: #ff0000}
a.one:visited {color: #0000ff}
a.one:hover {color: #ffcc00}
a.five:link {color: #ff0000; text-decoration: none}
a.five:visited {color: #0000ff; text-decoration: none}
a.five:hover {text-decoration: underline}
伪类应用之表单。我们在表单这样的一个操作过程中会用到伪类这样的一个语句。
input:focus
{
background-color:yellow;
}
应用二。首个子元素也可以使用这个伪类语句。
p:first-child {font-weight: bold;}
li:first-child {text-transform:uppercase;}
应用三:我们有的时候应用伪类语句是通过lang来实现的。
q:lang(no)
{
quotes: "~" "~"
}
伪类的语法。其实伪类的语法还是相对简单的。
selector : pseudo-class {property: value}
伪类与 CSS 类并不矛盾,这两个不同意义的类语句可以结合在一起应用的。
a.red : visited {color: #FF0000}