CSS子选择符也可以称为子对象选择符、子选择器等，主要用于定义某个元素中子元素对象的样式，无法定义子元素以外的对象。
子选择器可以让我们指定要的是哪个父标签的哪个子标签。也就是说，子选择器只对元素的子元素生效，而不会影响到其它元素的后代元素。
所谓子元素，类似于下面的格式：
<p><strong>子元素</strong>的格式</p>strong元素就是p元素的子元素。
CSS子选择符的定义
子选择符的选择符与选择符之间必须使用大于号（>）符号。例如：
<style type="text/css">
<!--
body > strong{
color:#FF0000;
font-size:18px;
text-decoration:underline;
}
-->
</style>
上述CSS代码定义了body元素中的子元素strong元素的样式。
再看一个结合后代选择器和子选择器的例子：
table.company td > p
上面的选择器会选择作为td元素中所有的子元素（p元素），这个td元素本身从table元素继承，而该table元素又有一个包含company的class属性。
子选择符的使用示例
在浏览器中查看CSS子选择符的显示效果。
源代码如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>CSS子选择符示例-www.baike369.com</title>
<style type="text/css">
<!--
p > strong{
color:#FF0000;
font-size:18px;
text-decoration:underline;
}
-->
</style>
</head>
<body>
<p>定义了p元素中的子元素<strong>strong元素</strong>的样式！</p>
<p>在p元素中<em><strong>strong元素</strong>不是p元素的子元素，所以不起作用！</em></p>
<p>在<strong>p元素</strong>中，两个<strong>strong元素</strong>的使用方法！</p>
<p>在<strong>p元素中，<strong>strong元素</strong>的嵌套使用方法！</strong></p>
</body>
</html>
如下图所示：
提示
并不是所有的浏览器都支持子选择符！IE7以下版本的IE浏览器不支持！
由于IE 6.0及更早的版本不支持子选择器，因此这种选择器经常用于对IE 6.0隐藏某些CSS规则使用。
468
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
