
超链接的Lvfha
发布日期:2021-05-07 16:40:48
浏览次数:12
分类:原创文章
本文共 944 字,大约阅读时间需要 3 分钟。
超链接的Lvfha
lvfha
表示超链接的五种状态,也是5个伪类,lvfha
表示应用这5个伪类为超链接添加样式时应该遵守的原则性顺序
a 处于任意状态的超链接a:link 设置还没有访问过的超链接样式a:visited 设置访问以后的超链接样式a:focus 设置获取到鼠标焦点的超链接的样式,一旦鼠标点击其余位置,则马上切换到visited状态a:hover 设置鼠标悬浮的超链接样式a:active 设置鼠标按下时的超链接样式
其中focus, hover, active
不太好区分,focus
是一种延续性状态,而hover, active
是短暂性状态
正因为focus
是一种延续性状态,所以要放在短暂性的hover, active
之前,否则最后鼠标划过时不会表现出hover样式(因为这些样式都是针对a标签设定的,根据层叠规则,先声明的hover
会被focus
覆盖掉)
link
和visited
是互斥的,不存在重叠,并且这两者属于永久性状态
为了让短暂性状态和持续性状态有表现机会,就把focus/hover/active
放在link/visited
后面,让长状态的层叠优先级更低一些,所以就有了lvfha原则
注意:如果各个状态下设置的样式存在冲突(设置有相同样式名的不同值),则需要严格遵守lvfha
原则;如果不存在样式冲突,则可以不按照该规则执行
例如:下面的悬浮样式将永远不会生效,因为被覆盖掉了
a:hover { text-decoration: underline overline;}a:link { text-decoration: none;}a:visited { text-decoration: none;}
参考:
[1] http://www.ayqy.net/doc/css2-1/selector.html#dynamic-pseudo-classes
[2] http://www.ayqy.net/blog/%E8%B6%85%E9%93%BE%E6%8E%A5%E7%9A%84lvha%E5%8E%9F%E5%88%99/
发表评论
最新留言
留言是一种美德,欢迎回访!
[***.207.175.100]2025年03月31日 14时42分09秒
关于作者

喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
JSP内置对象:操作cookie、session对象
2019-03-04
【数算-27】多路查找树【了解】
2019-03-04
【数算-31】【十大常用算法-03】动态规划算法与背包问题
2019-03-04
【SE-02】多线程-02
2019-03-04
$set的使用(视图不能实时更新)
2019-03-04
一、硬件防火墙
2019-03-04
Javaweb jQuery功能练习
2019-03-04
余生,愿你能靠近那些正能量的人——
2019-03-04
初学QT
2019-03-04
IOC容器_Bean管理xml方式
2019-03-04
蓝桥杯入门练习题斐波那契数列
2019-03-04
(Java基础类库 )System类
2019-03-04
context:include-filter与exclude-filte控制扫描组件
2019-03-04
【SSL】1072砝码称重
2019-03-04
js数据结构--队列--常见操作
2019-03-04
JS数据结构--单向链表--常见操作
2019-03-04
JS数据结构--双向链表--常见操作
2019-03-04
全排列(深度优先搜索+递归)
2019-03-04
多项式插值法的Python程序
2019-03-04
vue.js常用指令及用法
2019-03-04