css匹配子代的第一个元素怎么写

html-css014

css匹配子代的第一个元素怎么写,第1张

:first-child /* 匹配第一个元素 */

举例:(parent下的第一个子元素字体变红色)

.parent > :first-child {color:red} <div class="parent">

    <p>子元素1</p>

    <div>子元素2</div>

    <span>子元素3</span>

</div>

css2里的伪类均摊符,意思是:匹配父元素的第一个子元素

你可以在css手机里可以查到这个伪类选择符

比如:

<ul>

<li>列表项一</li>

<li>列表项二</li>

<li>列表项三</li>

<li>列表项四</li>

</ul>

在上述代码中,如果我们要设置第一个li的样式,那么代码应该写成li:first-child{sRules},而不是ul:first-child{sRules}。其它相关的伪类都如此。

:

first-child

伪类

向元素的第一个子元素添加样式

利用:first-child

这个伪类,只有当元素是另一个元素的第一个子元素时才能匹配。例如,p:first-child

会选择作为另外某个元素第一个子元素的所有

p

元素。一般可能认为这会选择作为段落第一个子元素的元素,但事实上并非如此,如果要选择段落的第一个子元素,应当写为

p

>

*:first-child。

http://www.

w3school

.com.cn/css/pr_pseudo_first-child.asp

这个送你,祝你学的开心