WonderCSS

关于CSS样式表里面的大于号

有些CSS中会出现大于号“ > ”,套用 WOWer 众的话来说那就是:亲儿子。“ > ”的意思为仅作用于子级,它能很好的控制CSS中的层级关系,尤其在用CSS做多层次菜单时“ > ”可以很好的控制菜单的子母关系。

直观的看,如下:


<style type="text/css">
	#boxs { color:#000;}
	/* for son*/
	#boxs > span { color:red;}
	/* for grandson*/
	#boxs > div > span { color:blue;}
</style>

<div id="boxs">
	<span>son</span>
	<div>
		<span>grandson</span>
	</div>
	<p>black</p>
</div>

#boxs > span 只能作用到第一层span,无法作用到DIV中第二层的span。需要注意的是 IE6 不支持这个用法。

By 于湛 发布于 2013.02.22 8,669 次浏览

关于CSS样式表里面的大于号》上有3条评论

  1. Pingback引用通告: 无需 JS 制作纯 CSS 子菜单 | WonderCSS

  2. Pingback引用通告: CSS 中的优先权 !important | WonderCSS

  3. Pingback引用通告: 让我们来了解20个常用CSS选择器吧 | WonderCSS

发表评论

电子邮件地址不会被公开。 必填项已用*标注