开发者

css styling of unordered list containing 5 ul's with same classnames, apply different styles to each

X:nth-of-type(n)

ul:nth-of-type(3) {   
border: 1px solid black;   
}  
ul:nth-of-type(3) {
border: 1px solid black;
}

There will be times when, rather than selecting a child, you instead need to select according to the type of element.

Imagine mark-up that contains five unordered lists. If you wanted to style only the third ul, and didn't have a unique id to hook into, you could use the nth-of-type(n) pseudo clas开发者_JAVA百科s. In the snippet above, only the third ul will have a border around it.

I have the above didn't work

dropmenu

<li class="submenu">
<ul.level2>
<li>something</li>
<li>something2</li>
</ul>

<ul.level2>
<li>something</li>
<li>something2</li>
</ul>

<ul.level2>
<li>something</li>
<li>something2</li>
</ul>

The list above is dynamicly generated by a php script and I can't change the class names therefore when I apply styles to the ul element ,it is the same for all. Thanks for all help


Which browser are you testing this in because the pseudo-class :nth-of-type(n) is not supported across all browsers. For example, it is not supported in Internet Explorer.


is it possible to remove the .level2 from the ul tags and replace with <ul class="level2">? Then your css should work.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜