mozilla

Compare Revisions

:first-child

Change Revisions

Revision 41223:

Revision 41223 by Fredchat on

Revision 41224:

Revision 41224 by Wjjohnst on

Title:
:first-child
:first-child
Slug:
CSS/:first-child
CSS/:first-child
Tags:
css, "CSS Reference", Selectors
css, "CSS Reference", Selectors
Content:

Revision 41223
Revision 41224
n8      Selects any element that is the first child element of its n8      {{ CSSRef() }}
>parent. 
nn10    <h3 name="Summary">
11      Summary
12    </h3>
n11      Ex:<br>n14      The <code>:first-child</code> pseudo-class matches any elem
 >ent that is the first child element of its parent.
12      ul li:first-child{color: green}
nn16    <h3 name="Syntax">
17      Syntax
18    </h3>
19    <pre class="eval">
20element:first-child { <i>style properties</i> }
21</pre>
n15      &lt;ul&gt;<br>n23      <br>
16      &lt;li&gt;<span style="color: green">one</span>&lt;/li&gt;<
>br> 
17      &lt;li&gt;two&lt;/li&gt;<br>
18      &lt;/ul&gt;
tt25    <h3 name="Examples">
26      Examples
27    </h3>
28    <pre>
29span:first-child
30{
31    background-color: lime;
32}
33</pre>
34    <p>
35      ...where...
36    </p>
37    <pre>
38  &lt;div&gt;
39    &lt;span&gt;This span is limed!&lt;/span&gt;
40    &lt;span&gt;This span is not. :(&lt;/span&gt;
41  &lt;/div&gt;
42</pre>
43    <p>
44      ... should look like ...<br>
45      <span style="background-color: lime">This span is limed!</s
 >pan> <span>This span is not.&nbsp;:(</span>
46    </p>
47    <h3 name="Notes">
48      Notes
49    </h3>
20    <div class="noinclude"></div>{{ wiki.languages( { "fr": "fr/C50    <div class="noinclude"></div>{{ languages( { "fr": "fr/CSS/:f
>SS/:first-child", "pl": "pl/CSS/:first-child" } ) }}>irst-child", "pl": "pl/CSS/:first-child" } ) }}

Back to History