内容发布更新时间 : 2024/5/17 9:45:45星期一 下面是文章的全部内容请认真阅读。

选择带有以 \开头的lang属性值的每个

元素，并设置其样式： p:lang(en) {

background:yellow; }

浏览器支持

所有主流浏览器都支持 :lang选择器。

注释：对于 IE8 中的 :lang，必须声明 。 定义和用法

:lang选择器用于选取带有以指定值开头的lang属性的元素。

注释：该值必须是整个单词，即可是单独的，比如lang=\，也可后跟连接符，比如lang=\。

CSS3 element1~element2 选择器

实例

为所有相同的父元素中位于 p 元素之后的所有ul元素设置背景： p~ul {

background:#ff0000; }

浏览器支持

所有主流浏览器都支持 element1~element2 选择器。 注释：对于 IE8 中的该选择器，必须声明 。 定义和用法

element1~element2 选择器 element1 之后出现的所有 element2。

—25—

两种元素必须拥有相同的父元素，但是 element2 不必直接紧随 element1。

CSS3 [attribute^=value] 选择器

实例

设置 class 属性值以 \开头的所有 div 元素的背景色： div[class^=\ {

background:#ffff00; }

浏览器支持

所有主流浏览器都支持 [attribute^=value] 选择器。 注释：对于 IE8 及更早版本中的 [attribute^=value]，必须声明 。 定义和用法

[attribute^=value] 选择器匹配属性值以指定值开头的每个元素。 亲自试一试 - 实例

设置 class 属性值以 \开头的所有元素的背景色： [class^=\ {

background:#ffff00; }

CSS3 [attribute$=value] 选择器

实例

—26—

设置 class 属性值以 \结尾的所有 div 元素的背景色： div[class$=\ {

background:#ffff00; }

浏览器支持

所有主流浏览器都支持 [attribute$=value] 选择器。 注释：对于 IE8 及更早版本中的 [attribute$=value]，必须声明 。 定义和用法

[attribute$=value] 选择器匹配属性值以指定值结尾的每个元素。 亲自试一试 - 实例

设置 class 属性值以 \结尾的所有元素的背景色： [class$=\ {

background:#ffff00; }

CSS3 [attribute*=value] 选择器

实例

设置 class 属性值包含 \的所有 div 元素的背景色： div[class*=\ {

background:#ffff00; }

—27—

浏览器支持

所有主流浏览器都支持 [attribute*=value] 选择器。 注释：对于 IE8 及更早版本中的 [attribute*=value]，必须声明 。 定义和用法

[attribute*=value] 选择器匹配属性值包含指定值的每个元素。 亲自试一试 - 实例

设置 class 属性值包含 \的所有元素的背景色： [class*=\ {

background:#ffff00; }

CSS3 :first-of-type 选择器

实例

指定父元素的首个 p 元素的背景色： p:first-of-type {

background:#ff0000; }

浏览器支持

所有主流浏览器均支持 :first-of-type 选择器，除了 IE8 及更早的版本。 定义和用法

—28—

:first-of-type 选择器匹配属于其父元素的特定类型的首个子元素的每个元素。

提示：等同于 :nth-of-type(1)。

CSS3 :last-of-type 选择器

实例

指定父元素的最后一个 p 元素的背景色： p:last-of-type {

background:#ff0000; }

浏览器支持

所有主流浏览器均支持 :last-of-type 选择器，除了 IE8 及更早的版本。 定义和用法

:last-of-type 选择器匹配属于其父元素的特定类型的最后一个子元素的每个元素。

提示：等同于 :nth-last-of-type(1)。

CSS3 :only-of-type 选择器

实例

指定属于父元素的特定类型的唯一子元素的每个 p 元素： p:only-of-type {

background:#ff0000; }

—29—