0

我正在使用嵌套有序列表中的 css 构建菜单。我想要实现的 - 尚未成功 - 每个嵌套级别都放置在单独的行中。我在 codepen 上创建了一个测试用例，如果能帮助我解决这个问题，我将不胜感激。这是笔：http ://codepen.io/peterschmidler/pen/CkzpF

提前非常感谢！

彼得

编辑：感谢您提示正确嵌套列表。但我仍然无法解决主要问题：如何为每个活动级别呈现单独的行中的列表。我更新了代码以澄清问题：http ://codepen.io/anon/pen/lzHda

我将非常感谢任何帮助，以解决纯 CSS 的问题。

谢谢。

4

2 回答 2

0

您没有正确嵌套列表。<ol>只能包含<li>. 你应该把你的嵌套<ol>放在一个<li>. 像这样的东西：

<ol>
 <li>main1</li>
 <li>main2
  <ol>
   <li>sub1</li>
   <li>sub2
     <ol>
       <li>subsub1</li>
     </ol>
   </li> <!-- closing sub 2 -->
   <li>sub3</li>
  </ol>
 </li> <!-- closing main 2 -->
 <li>main3</li>
</ol>

这应该让你回到正轨...

于 2012-07-30T21:13:56.893 回答
0

嵌套列表中的每个新<ol>条目都应放在<li>.

在您的情况下，尝试嵌套这部分代码：

<ol>
    <li>
        <a href="about-team"class="active">Team</a>
    </li>
    <ol>
        <li>
            <a href="about-team-peter">Peter</a>
        </li>
        <li>
            <a href="about-team-schmidler">Schmidler</a>
        </li>
    </ol>
</ol>

在一个<li>. 像这样：

    <li>
        <a href="about-team"class="active">Team</a>

           <ol>
            <li><a href="about-team-peter">Peter</a></li>
            <li><a href="about-team-schmidler">Schmidler</a></li>
           </ol>
</li>
于 2012-07-30T23:03:58.867 回答