css 这样的选择器有什么区别吗?

来源:百度知道 编辑:UC知道 时间:2024/06/27 23:25:39
<style>
#menu {
font-family:Arial;
font-size:14px;
margin:0 auto 0 0;
background:url(under.gif);
}

#menu ul {
display:block;
width:500px;
padding:0 0 0 8px;
margin:0;
list-style:none;
height:35px;
}

#menu ul li {
float:left;
}

#menu ul li a{
display:block;
float:left;
line-height:35px;
color:#ddd;
text-decoration:none;
padding:0 0 0 14px;
}

#menu ul li a:hover{
color:#fff;
background: url(hover.gif);
}

#menu ul li a b{
display:block;
padding:0 14px 0 0;
}

#menu ul li a:hover b{
color:#fff;
background: url(hover.gif) no-repeat right top;
}

</style>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>玻璃效果菜单</title></head>

&l

li a:hover{ }:指LI下面的A标签鼠标经过使用样式属性

li a:hover b{ }:指LI下面的A标签鼠标经过时下面的B标签使用样式属性

如:<li><a href="#"><b> Map </b></a></li>
意思是:在A标签使用样式时,B再使用样式,就像是叠加..双重样式..就是你的玻璃效果....

li a:hover{ }写处边,li a:hover b{ } 写内边

还有你问题里的bover应该是hover吧?

他们之间没什么区别

都是指鼠标经过时的样式

主要不同就是一个是对A标签使用的样式

一个是对A标签下B标签使用的样式

其它我认为这完全没必要

不信你可以只使用其中一个就可以实现效果了

两个反而会使代码多 加载速度慢

我做这这么多年的div css页面制作 还真没用过这样的两个hover叠加

没什么实际意义 不过也许对初学者诱惑大吧 漂亮的东西不一定实用

呵呵