1. 爱易网页
  2. HTML教程
  3. :hover失效的奇怪有关问题

:hover失效的奇怪有关问题

日期：2014-05-17　 浏览次数：20870 次

:hover失效的奇怪问题
HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<style type="text/css">
.b .c {
    background:#ffff99;
}
span:hover {
    background:#5b1672;
}

</style>
</head>

<body>
    <div class="b">
        <span class="c">
            asdddffgghh
        </span>
    </div>
</body>
</html>

上面的:hover失效了，写成下面的几种都正常，为什么上面的不行，谁能解释下，谢谢

CSS code

.b .c {
    background:#ffff99;
}
.b span:hover {
    background:#5b1672;
}

CSS code

.c {
    background:#ffff99;
}
span:hover {
    background:#5b1672;
}

CSS code

.c {
    background:#ffff99;
}
.b span:hover {
    background:#5b1672;
}



------解决方案--------------------
2个地方定义一个属性，究竟使用哪个，这涉及到css 优先权的问题。

相关资料更多>

  1. META标签的微妙
  2. 在GitHub上，预览访问html代码的成效
  3. 一个铺展子节点的html+js代码
  4. CSS模块化(1) CSS模块化的背景
  5. map area 确定图片区域后，想点击之后传递参数到另一界面，该如何避免
  6. “画中画”效果--谈IFRAME标签的运用
  7. 新浪 博客 CSS 式样
  8. 请教css中如何把回车设置成不占位的，求解答。
  9. 施用easyUI转换HTML table到datagrid