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 に答える