#navcontainer{
background:#0099FF/*背景色*/
border-top:1px solid #FF3333/*边框*/
}
#navlist{
list-style:none/*li前面去掉默认的小圆点符号*/
margin:0px/*外边距0*/
padding:0px/*内边距0*/
}
#navlist li{
position:relative/*元素相对对齐*/
display:inline/*将li设为不换行的行内元素*/
bottom:11px/*元素相对对齐的位移距离,离底部11像素*/
line-height:20px/*行高20px*/
margin:0px/*这里的margin是相对什么的外边距?是相对#navlist这个容器的外边距嘛?是外边距,是每个li的外边距,不是navlist的外边距*/
padding:0px/*内边距0*/
background-color:#000/*背景色*/
margin:0px 3px 3px 1px/*为什么设置了margin:0px,之后还要设置margin:0px 3px 3px 1px这是为什么?css中后面的设置可以覆盖前面的那个设置,在这里前面那句可以删除,估计也是个新手写的,他范了个小错*/
padding:0px 0px 1px 0px/*内边距上:0 右:0 下、左:1像素*/
}
#navlist a,#navlist a:link,#navlist a:visited{
background:#FF9900/*背景色*/
border:1px solid #fff/*边框*/
height:16px/*高度*/
margin:0px/*这里的margin是相对什么的外边距?是让所有在 navlist 里面的链接都有个外边距*/
padding:3px 5px 3px 5px/*内边距*/
position:relative/*元素相对对齐*/
right:2px/*元素相对对齐,离右边2px*/
bottom:2px/*元素相对对齐,离底部2px*/
text-decoration:none/*链接去掉下划线*/
display:inline/*为什么#navlist li{display:inline}设置了横向导航,#navlist a{display:inline}连接还要设置横向排列啊!你问得非常有水平,你找到了一处多余但并不影响整体结果的小错误,同上,写这个的人是个新手*/
}
#navlist a:hover{
background:#c00/*背景*/
color:#fff/*文字颜色*/
position:relative/*相对对齐*/
right:1px/*相对对齐位移距离*/
bottom:1px/*相对对齐位移距离*/
}
/*后面的都差不多了,和上面一样的*/
#navlist a:active{
background:#999
color:#fff
position:relative
right:0px
bottom:0px
}
#navlist li#active{
background:#ff0000
padding:0px
margin:0px 3px 0px 0px
position:relative
bottom:13px
}
#navlist #active a,#navlist #active a:link,#navlist #active a:visited,#navlist #active a:hover{
background:#369
border-bottom:none
border-left:1px solid #9cc
border-right:1px solid #9cc
border-top:1px solid #9cc
position:relative
right:0px
bottom:0px
color:#fff
margin:0px
padding:2px 5px 0px 5px
}
</style>
因为这个不是群组选择器啊,.player-block .info {}是指这个元素包括这两个类才会有效果。
例如:
<div class="player-block info ">
被选择的元素
</div>
用逗号隔开的选择器是说这若干个用逗号隔开的选择器都平等地使用后面大扩号里规定的样式。如
#id_a,.class_a{color:red}
意思是#id_a和.class_a里的字体颜色都适用红色
可以理解为逗号隔开的选择器地位是平等的。