CSS3 属性选择器允许你选择具有指定属性或属性值的元素。下面是一些常用的 CSS3 属性选择器:
[property] { /* 匹配有指定属性的元素 */ } [property=value] { /* 匹配属性值完全等于指定值的元素 */ } [property~=value] { /* 匹配属性值包含指定值的元素 */ } [property|=value] { /* 匹配属性值以指定值开头或者包含指定值并以破折号分隔的元素 */ } [property^=value] { /* 匹配属性值以指定值开头的元素 */ } [property$=value] { /* 匹配属性值以指定值结尾的元素 */ } [property*=value] { /* 匹配属性值包含指定值的元素 */ }
以下是一些实际用途的例子:
/* 选择所有有 title 属性的元素 */ [title] { color: red; } /* 选择所有 class 属性包含 "test" 的元素 */ [class~=test] { color: blue; } /* 选择所有 href 属性以 "http" 开头的链接 */ [href^=http] { text-decoration: underline; } /* 选择所有 href 属性以 ".pdf" 结尾的链接 */ [href$=.pdf] { text-decoration: none; } /* 选择所有 href 属性包含 "example" 的链接 */ [href*=example] { font-weight: bold; }
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。