学习CSS的伪类

春梦一秋

春梦一秋

2016-02-19 14:16

岁数大了,QQ也不闪了,微信也不响了,电话也不来了,但是图老师依旧坚持为大家推荐最精彩的内容,下面为大家精心准备的学习CSS的伪类,希望大家看完后能赶快学习起来。

和一般的CSS语法不同,CSS伪类的语法有两种。

第一种:

selector:pseudo-class {property: value}

也可以用HTML的class属性来设定伪类。

例句:

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

a:link {color:red}

第二种:

selector.class:pseudo-class {property: value}

伪类是最常用的伪类。

例句:

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

a.c1:link {color:red}

(本文来源于图老师网站,更多请访问https://m.tulaoshi.com/webkaifa/)

锚(a)伪类

锚(a)伪类是最常用的伪类。例句如下:

a:link {color: #FF0000} /* 未被访问的链接 红色 */
a:visited {color: #00FF00} /* 已被访问过的链接 绿色 */
a:hover {color: #FFCC00} /* 鼠标悬浮在上的链接 橙色 */
a:active {color: #0000FF} /* 鼠标点中激活链接 蓝色 */

也可以用HTML的class属性来设定伪类。例句如下:

a.c1:link {color: #FF0000} /* 未被访问的链接 红色 */
a.c1:visited {color: #00FF00} /* 已被访问过的链接 绿色 */
a.c1:hover {color: #FFCC00} /* 鼠标悬浮在上的链接 橙色 */
a.c1:active {color: #0000FF} /* 鼠标点中激活链接 蓝色 */

例句:actived的顺序书写。

注:由于CSS优先级的关系(后面比前面的优先级高),在写a的CSS时,一定要按照a:link, a:visited, a:hover, a:actived的顺序书写。

展开更多 50%)
分享

猜你喜欢

学习CSS的伪类

Web开发
学习CSS的伪类

简单了解学习CSS的伪类

Web开发
简单了解学习CSS的伪类

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

css伪类伪元素

Web开发
css伪类伪元素

初学入门简单了解学习CSS的伪类

Web开发
初学入门简单了解学习CSS的伪类

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

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

Web开发
CSS基础教程:CSS的Pseudo Classes 伪类

谈谈CSS样式表中的类和伪类

Html CSS布局 Div+CSS XHTML
谈谈CSS样式表中的类和伪类

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

Delphi图象截取编程示例(2)

Delphi图象截取编程示例(2)

三种CSS图表代码

三种CSS图表代码
下拉加载更多内容 ↓