1. Home
  2. Computing & Technology
  3. Web Design / HTML

What is a CSS Child Selector?

By Jennifer Kyrnin, About.com

A CSS child selector applies to the elements that are children of another element. A child element is an element that is the immediate or direct descendant of another element. For example all the <li> elements in an unordered list are children of the <ul>. But any anchors on the <li> elements are not children of the <ul>:

<ul>
<li><a href="">...</a></li>
</ul>

Define child selectors by using two type selectors separated by a greater-than sign (>).

li > a {
text-decoration : none ;
}

If you have the following CSS: [blockquote]p > strong {
color : purple ;
}[/blockquote]

Think about how it would impact the following HTML: [blockquote] <div>Text in a div with <strong>a strong</strong> element inside of it.</div>
<p>HTML in a paragraph with <strong>a strong</strong> element inside of it.</div> [/blockquote]

Only the second strong element will be purple.

More Web Design / HTML Quick Tips

Explore Web Design / HTML

More from About.com

  1. Home
  2. Computing & Technology
  3. Web Design / HTML
  4. CSS
  5. CSS Selectors
  6. CSS Child Selectors - What is a CSS Child Selector

©2008 About.com, a part of The New York Times Company.

All rights reserved.