CSS继承选择器与包含选择器的比较

 

CSS继承选择器与包含选择器的比较

作者：sagahu@163.com
日期：2011-12-21

---

CSS继承选择器与包含选择器的作用很像，其类似点主要有：

• 继承选择器的子孙元素可以继承到祖先元素的某些样式；而包含选择器的子元素可以得到其父元素的某些样式。
• 不是祖先元素/父元素的所有样式属性都能为子孙元素/被包含的子元素得到，只是某一些（可查阅相关资料）。

其不同点也有：

• 继承选择器的子孙元素无论是祖先元素的多少级子孙，都满足这种继承关系，因而可以继承到祖先元素的某些属性；而包含选择器的被包含子元素只能是被父元素直接包含，才是匹配那个包含选择器，因而才能得到那个选择器定义的某些样式。

例如：

• p b { ... } // 标签b继承标签p定义的样式，无论标签b是标签p的多少级子孙都满足这个选择器定义。
• p>b { ... } // 标签b是直接被标签p包含的，才能满足这个样式定义，得到这个选择器定义的样式。