属性选择器

Posted 2020-11-20 fmgao-technology

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了属性选择器相关的知识，希望对你有一定的参考价值。

除了html元素的id属性和class属性外，还可以根据HTML元素的特定属性选择元素。

根据属性查找

[title] {
  color: red;
}

找到所有title属性等于hello的元素：

[title="hello"] {
  color: red;
}

找到所有title属性以hello开头的元素：

[title^="hello"] {
  color: red;
}

找到所有title属性以hello结尾的元素：

[title$="hello"] {
  color: red;
}

找到所有title属性中包含（字符串包含）hello的元素：

[title*="hello"] {
  color: red;
}

找到所有title属性(有多个值或值以空格分割)中有一个值为hello的元素：

[title~="hello"] {
  color: red;
}

input[type="text"] {
  backgroundcolor: red;
}

以上是关于属性选择器的主要内容，如果未能解决你的问题，请参考以下文章