css⼀个标签添加多个class的样式顺序问题在使⽤jquery给div元素添加class时发现⼀个问题。就是后添加的class中的式样没有覆盖掉原来的class中的式样。相关css如下：
/*div标签原有样式*/
.nav>.navlogin, .navregist {
width: 230px;
margin: 0 10px;
overflow: hidden;
line-height: 50px;
text-align: center;
float: left;
color: #626262;
font-weight: 200;
font-size: 24px;
letter-spacing: 1em;
border-bottom: 1px solid #000;
}
/*⿏标进⼊时添加的样式*/
.hover {
border-bottom: 2px solid #3182d9;
cursor: pointer;
color: #3182d9;
}
jquery在一个元素后追加标签html如下：
<!--选择登录还是注册-->
<div class="nav">
<div class="navlogin">登录</div>
<div class="navregist hover">注册</div>
</div>
对应的事件是⿏标进⼊哪个div之后，该div的⽂字和底边框颜⾊发⽣改变。
效果如图：
会发现⿏标移到登录div样式并没有发⽣改变。但是明明登录和注册的样式是⼀起定义，且定义在.hover之前的。
原因
经过尝试才知道原来.nav>.nablogin的优先级要⾼于后⾯写的.hover。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。