例子 1 - 匹配第一个 <p> 元素
在下面的例子中，选择器匹配作为任何元素的第一个子元素的 p 元素：
<html><head><style type="text/css">p:first-child{ ?color: red; ?} </style></head><body><p>some text</p><p>some text</p></body></html>
例子 2 - 匹配所有 <p> 元素中的第一个 <i> 元素
在下面的例子中，选择器匹配所有 <p> 元素中的第一个 <i> 元素：
<html><head><style type="text/css">p > i:first-child{ ?font-weight:bold; ?} </style></head><body><p>some<i>text</i>. some <i>text</i>.</p><p>some<i>text</i>. some <i>text</i>.</p></body></html>
例子 3 - 匹配所有作为第一个子元素的 <p> 元素中的所有 <i> 元素
在下面的例子中，选择器匹配所有作为元素的第一个子元素的 <p> 元素中的所有 <i> 元素：
<html><head><style type="text/css">p:first-child i{ ?color:blue; ?} </style></head><body><p>some<i>text</i>. some<i>text</i>.</p><p>some <i>text</i>. some <i>text</i>.</p></body></html>
TIY
css 记录
原文地址：https://www.cnblogs.com/my2018/p/9197514.html