Question

Posted

I'm trying to understand what '>' does more and want to select the first level in my ul list. Can you tell me what do use. I coded out the html and would like to know how to select the first level and then second level only. Thanks

[CODE]


<ul id="blogPost">

<li><!-- First Level -->
<a href="#">
<ul>
<li><!-- Second Level -->

</li>
</ul>
</a>
</li>

<li><!-- First Level -->
<a href="#">
<ul>
<li><!-- Second Level -->

</li>
</ul>
</a>
</li>

<li><!-- First Level -->
<a href="#">
<ul>
<li><!-- Second Level -->

</li>
</ul>
</a>
</li>

</ul>
[/CODE]

Share this post


Link to post
Share on other sites

3 answers to this question

  • 0

Posted

ul > li

does select the li that are child of the ul.


ul li

does select the li that are descendant of the ul.


[CODE]
<ul id="premier">
<li>child of ul premier</li>
<li>
child of ul premier

<ul id="deuxieme">
<li>descandant of ul premier and child of ul deuxieme</li>
</ul>
</li>
</ul>
[/CODE]

Share this post


Link to post
Share on other sites
  • 0

Posted

[CODE]
ul#blogPost > li a{color: red;}
ul>:first-child{color: green;}
[/CODE]

That will style all the top level lis red, and the first of all the child elements green. If you want all of the lis of the child uls green, just specify to that level, i.e:

[CODE]
ul li ul li{style: something}
[/CODE]

Share this post


Link to post
Share on other sites
  • 0

Posted

don't need the > before :first-child

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.