私はここで疑似クラスを試していて、通常はスタイルクラスで何かをしようとしています。私は、順序付けされていない複数のリストを持つ順不同リストを持っています。リストの疑似クラス
のタグの最初のレベルが左に浮動するように設定したいだけです。 ここに私のhtmlです
<body>
<div id="MainMenu">
<ul id="nav">
<li><a href="#">Home</a></li>
<li>
<a href="#">About</a>
<ul>
<li><a href="#">The Product</a></li>
<li><a href="#">Meet The Team</a></li>
</ul>
</li>
<li>
<a href="#">Contact</a>
<ul>
<li>
<a href="#">Business Hours</a>
<ul>
<li><a href="#">Week Days</a></li>
<li><a href="#">Weekends</a></li>
</ul>
</li>
<li><a href="#">Directions</a></li>
</ul>
</li>
</ul>
</div>
</body>
私はこのようなスタイルを試みました。
body {
font: 13px/160% Trebuchet MS,Arial,Helvetica,Sans-Serif;
margin:0;
padding:0
}
#nav{
list-style:none;
font-weight:bold;
width:100%;
}
#nav li{
float:left;
margin-right:40px;
position:relative;
}
この問題は、id navのすべてのli子孫が左に浮動するということです。今私は、最初のレベルのliタグを左に浮かべ、他のすべてのレベルのliタグを無視するだけです。すべてのトップレベルのliタグにクラス名を使用すると答えてください。私はすでに私がこれのようにそれにアプローチできることを知っています。私がしたのは、疑似クラスのいくつかを学び、このアプローチで私がどのように役立つかということです。
たとえば、#nav li:first-child {....}のようなものが必要ですが、これはトップulリストの最初のliを与えるだけです。私はulリストのすべてのトップレベルの子供を望んで、第2レベルを無視するliタグなど。これを達成できる擬似クラスがありますか?
おかげ
擬似クラスは、CSS3では新しいものではありません。 – BoltClock