CSS的属性选择器使用详解
导读： 可以为拥有指定属性的HTML元素设置样式，而不仅限于class和id属性。 注：只有在规定了!DOCTYPE时，IE7和IE8才支持属性选择器。在IE6及更低的版本中，不支持属性选择。 属性选择器 下面的例子为带有ti...
可以为拥有指定属性的HTML元素设置样式，而不仅限于class和id属性。
注：只有在规定了!DOCTYPE时，IE7和IE8才支持属性选择器。在IE6及更低的版本中，不支持属性选择。
属性选择器
下面的例子为带有title属性的所有元素设置样式：
[title]
{
color:red;
}
属性和值选择器
下面的例子为title="W3School"的所有元素设置样式：
[title=hello]
{
border:5pxsolidblue;
}
属性和值选择器-多个值
下面的例子为包含指定值的title属性的所有元素设置样式。适用于由空格分隔的属性值：
[title~=hello]{
color:red;
}
下面的例子为带有包含指定值的lang属性的所有元素设置样式。适用于由连字符分隔的属性值：
[lang|=en]{
color:red;
}
设置表单的样式
属性选择器在为不带有class或id的表单设置样式时特别有用：
input[type="text"]
{
width:150px;
display:block;
margin-bottom:10px;
background-color:yellow;
font-family:Verdana,Arial;
}
input[type="button"]
{
width:120px;
margin-left:35px;
display:block;
font-family:Verdana,Arial;
}
本文转载自中文网
声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！
若转载请注明出处： CSS的属性选择器使用详解
本文地址： https://pptw.com/jishu/664881.html