Question

我在div类下有三个动态创建ul。所有三个都有相同的类名，li也有相同的类名。我怎么能用css控制第二个ul。

<div class="main">
<ul class="level_0">
<li></li>
<li></li>
</ul>

<ul class="level_0">
<li></li>
<li></li>
</ul>

<ul class="level_0">
<li></li>
<li></li>
</ul>
</div>

请指导我......

Answer 1

您可以编写类似

的规则

div.main ul:nth-of-type(2) {
   /* This will select 2nd ul */
}

Demo

Answer 2

<强> Demo

Css代码：

ul:nth-child(2) {  
   color: #ccc;
}

一个易于解释的网站：http://css-tricks.com/how-nth-child-works/

Answer 3

您可以使用nth-child选择器：

ul:nth-child(2)

这样做可以选择其父亲的第二个UL。

更多信息： http://www.w3schools.com/cssref/sel_nth-child.asp

Answer 4

你可以给他们一个ID：

<ul class="level_0" ">
     <li></li>
</ul>

<ul class="level_0" id="nmbr_2">
     <li></li>
</ul>

<ul class="level_0" ">
     <li></li>
</ul>

和你的css：

#nmbr2{
   //style
}

Answer 5

试试这个：

.main .level_0:first-child + .level_0

了解更多信息 Adjacent-Selectors W3C

仅使用css控制特定的ul

5 个答案: