网站CSS通用选择符、子选择符和相邻选择符
作者：佚名 时间：2014-03-10
通用选择符、子选择符和相邻选择符
前面提到了上下文选择符，这里说下网站CSS除逗号和空格之外，还定义了其他选择符模式，下列示例对此进行了说明：
*{color: purple; font: zapfDingbats}
ol > li {font-size: 20%;font-style: italic;}
h1 + h2 {margin-top: +4mm}
在第一个示例中，通用*选择符会将样式应用到文档的所有元素中，这样所有文本都会用ZapfDingBat字符显示。第二个示例选择了一种特殊的子/父关系，在这个示例中，条目都处于一个有序列表中。第三个示例则解释了相邻选择符类型，这种类型用来在文档中为两个相邻的内容选择标签。在这个示例里，特殊的选择符在文档的一个一级标题和紧接着的二级级标题之间加入了垂直空白。
属性选择符
还存在一种可能，就是仅把样式与那些具有特殊属性的HTMl/XHTML元素相连接。具体做法是，在元素名称之后样式定义之前，将扔需的属性列在方括号中：
div[align]{font-style: italic;}
div[align=left]{font-style: italic;}
div[title="bibliography"]{font-size: smaller}
div[lang="en"]{color: green}
第一个示例最简单：它仅用斜体显示那些包含align属性的<div>标签随后的内容，不管为该属性分配的何值。第二个示例则有一点挑剔，它仅与些align属性设置为left的<div>标签相匹配。
第三个示例匹配任何title属性包含单词"bibliography"的<div>标签，并特意用一个或者多个空格将该单词划分出来。部分字匹配没有计算在内；如果你曾经用过div[title~="a"],那么所匹配的<div>标签的title属性就要包含一个用空格隔开的单独的"a"(在标题的开始处或者结尾处)。
最后一个示例几乎是专门用来匹配在lang属性中指定的语言组。它匹配的<div>标签中lang属性必须设置为用连字符分隔的词语表，并且都要以"en"开头。该标例匹配的属性有lang=en、lang=en-us、lang=en-uk,诸如此类。
我们可以将通用选择符与属性选择符结合起来，这样就可以匹配特定属性的所有元素。例如：
*[class=comment]{display: none}
上述代码将隐藏文档中class属性为comment的所有元素。
如没特殊注明，文章均为上海联楷网络原创,转载请注明来自：http://www.linksj.com/contact/20151229/n7326.html
