使用CSS隐藏ul中的第一个li

6 html css css3

我有一个导航菜单,我想隐藏其中的第一项.例如

<ul>
   <li>Home</li>
   <li>About</li>
   <li>
      <ul>
         <li>Item 1</li>
         <li>Item 2</li>
         <li>Item 3</li>
      </ul>
   </li>
</ul>
Run Code Online (Sandbox Code Playgroud)

然后我在CSS中隐藏了这样的第一个元素:

li:first-child{
   visibility: hidden;
}
Run Code Online (Sandbox Code Playgroud)

但接下来会发生的事情是导航中的所有第一个li项目都不同,例如导航菜单中的"项目1".我如何只选择'home'li项并隐藏它?

谢谢!

小智 19

然后给你的第一个ul"classclass" .yourclass > li:first-child { visibility: hidden; }

隐藏第二个ul使用的第一个孩子 .yourclass > li > ul > li:first-child