Home > Article > Web Front-end > 伪类hover失效，关于CSS的优先级_html/css_WEB-ITnose
伪类hover失效，关于CSS的优先级_html/css_WEB-ITnose
- WBOYOriginal
- 2016-06-24 11:41:28851browse
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> a:hover{ color: #B61D1D; } .tag_a{ color: #333; } .tag_ul a{ color: #333; } </style></head><body> //hover失效 <ul class="tag_ul"> <li><a>用ul标签选中</a></li> </ul> //hover失效有效 <ul> <li><a class="tag_a">用a标签选中</a></li> </ul></body></html> 有没有大神 帮我解释一下 关于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; }
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article：input两种默认显示文字方式_html/css_WEB-ITnoseNext article：纯CSS打造银色MacBook Air（完整版）_html/css_WEB-ITnose