伪类选择器 | 学习笔记

简介: 快速学习伪类选择器。

开发者学堂课程【CSS 快速掌握:伪类选择器】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址https://developer.aliyun.com/learning/course/611/detail/9177


伪类选择器


内容介绍

一、伪类选择器

 

一、伪类选择器

1.什么是伪类选择器?

伪类选择器是用来给超级链接的不同状态来设置样式。

n  正常状态       超级链接没有被访问 :link

n  访问过后状态   超级链接已经被访问 :visited.

n  鼠标放上状态   鼠标放在超级链接上面,但是并没有将鼠标的左键按下去 :hover

n  激活状态       鼠标左键已经按下去了,但是并没有将鼠标的左键弹出:active伪类选择器都是带有冒号“:”

选择器

含义

clink

向未被访问的链接添加样式。

visited

向已被访问的链接添加样式。

:hover

当鼠标悬浮在元素上方时,向元素添加样式。

:active

鼠标放在元素上面时,点击的一瞬间

link 正常状态该超级链接还没有被访问

visited 访问过后状态该超级链接已经被访问了

hover 鼠标放上状态鼠标放上该超级链接的上面,但是并没有按鼠标的左键

active 激活状态鼠标左键按下去了,但是没有将鼠标左键松开

注意:超级链接的不同状态它其实是有顺序。也就是说伪类选择器设置其实是有顺序。

如果不按照伪类选择器的顺序,那么样式就会失效。

顺序:要遵守爱恨准则要先有爱,才有恨。“Love Hate”

相关文章
|
5月前
|
前端开发 开发者
提升你的CSS技能:深入理解伪类选择器和伪元素选择器!
【4月更文挑战第2天】 提升你的CSS技能:深入理解伪类选择器和伪元素选择器!
104 12
|
5月前
|
前端开发
伪类选择器
我是一个div ​ 选择器的累加不会超过其最大的一个数量级,类选择器在高也不会超过id选择器,你怎么加你都只能加那一位,两位数加不到三位数
|
5月前
|
前端开发
伪类,伪元素有什么,区别是什么
伪类,伪元素有什么,区别是什么
123 0
|
22天前
|
前端开发
伪类是什么?
伪类是什么?
31 3
|
5月前
|
前端开发
伪类是什么
伪类是什么。
20 1
|
前端开发
伪类和伪元素的区别?
伪类和伪元素的区别?
|
5月前
伪类
1.没有访问过的链接 ​ 2.访问过的链接
|
5月前
|
前端开发 开发者
CSS中的伪类选择器和伪元素选择器
CSS中的伪类选择器和伪元素选择器
51 0
|
前端开发 开发者
伪类 | 学习笔记
快速学习伪类
伪类 | 学习笔记
|
前端开发