第一个父级子元素可以这样nth-child(1){ 样式 }
除了上面的方法还可以通过给第一和最后一个元素设置一个额外的类来设置样式。
你不要应该给.menu ul li ul li加 position:absolute属性因为你是给li加的绝对定位 所以两个li的位置重合了 就只能看见最后一个
你应该把.menu ul li ul li的绝对定位去了
加在.menu ul li ul上面即可
<div class="menu">
<ul>
<li><a href="#">111</a>
<ul>
<li><a href="#">aaa</a></li>
<li><a href="#">bbb</a></li>
</ul>
</li>
<li><a href="#">222</a>
<ul>
<li><a href="#">aaa</a></li>
<li><a href="#">bbb</a></li>
<li><a href="#">ccc</a></li>
<li><a href="#">ddd</a></li>
</ul>
</ul>
</div>
<style>
.menu ul{
list-style: none
background: #00FF00
}
.menu ul li{
background: #00FFFF
height: 50px
width: 100px
float: left
position: relative
}
.menu ul li a{
background:#0000FF
}
.menu ul li ul{
position:absolute/*加到这里*/
left: 20px/*加到这里*/
top: 60px/*加到这里*/
}
.menu ul li ul li{
background:#FF0000
position:absolute/*这里去掉*/
left: 20px/*这里去掉*/
top: 60px/*这里去掉*/
height:100px
width:50px
}
.menu ul li ul li a{
background:#FFFF00
}
</style>
步骤1/6新建一个html文件,命名为test.html,用于讲解如何使用css设置表格最后一行的样式 。
步骤2/6
在test.html文件内,使用table标签创建一个表格,用于测试。
步骤3/6
在test.html文件内,设置表格的class属性为mycc。
步骤4/6
在css标签内,通过class设置table的宽度为300px,高度为300px。
步骤5/6
在css标签内,再通过tr和选择器“:last-child”设置表格最后一行的样式,定义它的背景颜色为粉红色,文本颜色为白色。
步骤6/6
在浏览器打开test.html文件,查看实现的效果。
租借号上万账号出租「1元起租」大型专业租号平台
安徽省刀锋网络科技广告查看详情
1、使用table标签创建一个表格,设置表格的class属性为mycc。
2、在css标签内,通过class设置table的宽度为300px,高度为300px。
3、在css标签内,再通过tr和选择器“:last-child”设置表格最后一行的样式,定义它的背景颜色为粉红色,文本颜色为白色。
4、在浏览器打开test.html文件,查看实现的效果