Css3 - 第一个孩子和最后一个孩子选择器问题

Question

我在编写我的第一个和最后一个孩子选择器时遇到了麻烦.

首先,我想从父导航菜单的最后一个子节点(不是下拉菜单)中删除右边框,我当前的代码也影响下拉菜单.我在移除第一个孩子的左边界方面遇到了同样的问题.

其次,我想在父导航菜单的左侧和右侧添加一个框阴影,但这也会影响到下拉菜单.

我会很感激我在哪里出错了.谢谢

我的CSS3代码是:

 ul#navmenu li:last-child a  {border-right: none;}

 ul#navmenu li:first-child a {border-left: none;}

 ul#navmenu li:last-child {box-shadow: 200px 0px 0px 0px white;}

 ul#navmenu li:first-child {box-shadow:-200px 0px 0px 0px white;}

Answer 1

ul使用>直接子选择器访问以下元素的直接子元素

 ul#navmenu > li:last-child a  {border-right: none;}

 ul#navmenu > li:first-child a {border-left: none;}

 ul#navmenu > li:last-child {box-shadow: 200px 0px 0px 0px white;}

 ul#navmenu > li:first-child {box-shadow:-200px 0px 0px 0px white;}

您当前的选择器就是ul#navmenu li选择所有可以处于任何级别的li标签ul.

但是这个选择器ul#navmenu > li将选择限制为只有直接的孩子,ul#navmenu这就是你需要的.