伪类hover失效,关于CSS的优先级_html/css_WEB-ITnose
程序员文章站
2022-06-03 19:17:27
...
//hover失效有效//hover失效
有没有大神 帮我解释一下 关于class的优先级!
回复讨论(解决方案)
加上href
既然楼主自己都试出加class后有效,,,那就加个class不就好了。。。
顺序为
a
a:visited
a:hover
a:active
权重(摘自《CSS实战手册》)
引入
示例
的背景色?
权重计算
原理
根据赋值给样式选择器(标签选择器 类选择器 ID选择器)的值
来确定样式的权重
最具体样式中的属性会胜出
方式
一个标签选择器 1分
一个类选择器 10分
一个ID选择器 100分
一个内建样式 1000分
举例
.navBox a
10 + 1 = 11分
.navBox .nav a
10 + 10 + 1 = 21分
.nav a
10 + 1 = 11分
.nav li a
10 + 1 + 1 = 12分
注
1) 继承来的属性没有任何权重值
2) 权重值相同时最后一个样式胜出
3) 先列出所有的外部样式表, 然后纳入内部样式.
忽略权重值
说明
CSS提供了一种可以完全忽略权重值的方法.
当你一定且必须要确保某一个特定的属性不被另一个更具体的样式覆盖时,
可以使用这种技术
只要在需要保护的属性后面插入 !important 就可避免被权重更大的属性覆盖.
示例
.navBox .nav a {background-color: red;}
a { background-color: black!important; }
上一篇: 哈希是什么意思??详细点
推荐阅读
-
css3中关于伪类的使用_html/css_WEB-ITnose
-
关于豆瓣首页图片链接失效的问题_html/css_WEB-ITnose
-
关于伪类a:hover用行样式表达,求解,_html/css_WEB-ITnose
-
关于伪类a:hover用行样式表达,求解,_html/css_WEB-ITnose
-
关于豆瓣首页图片链接失效的问题_html/css_WEB-ITnose
-
超链接的那些事(一): 伪类_html/css_WEB-ITnose
-
超链接的那些事(一): 伪类_html/css_WEB-ITnose
-
伪类hover失效,关于CSS的优先级_html/css_WEB-ITnose
-
这个效果能用CSS做出来吗? 关于hover的吧_html/css_WEB-ITnose
-
用一个例子学习CSS的伪类元素_html/css_WEB-ITnose