首页 > Web开发 > 详细

CSS笔记(二)CSS属性选择器

时间:2015-09-29 16:46:22      阅读:317      评论:0      收藏:0      [点我收藏+]

  对带有指定属性的HTML元素设置样式。

  参考: http://www.w3school.com.cn/css/css_syntax_attribute_selector.asp

 

选择器描述
[attribute] 用于选取带有指定属性的元素。
[attribute=value] 用于选取带有指定属性和值的元素。
[attribute~=value] 用于选取属性值中包含指定词汇的元素。
[attribute|=value] 用于选取带有以指定值开头的属性值的元素,该值必须是整个单词。
[attribute^=value] 匹配属性值以指定值开头的每个元素。
[attribute$=value] 匹配属性值以指定值结尾的每个元素。
[attribute*=value] 匹配属性值中包含指定值的每个元素。

 

  • 属性选择器

将所有带title属性的元素设置为红色:

[title]
{
    color:red;
}

使用:

<h2 title="Hello world">Hello world</h2>

效果:

技术分享

  • 属性和单值选择器

为title="Hello"的所有元素设置样式:

[title=Hello]
{
    border:5px solid blue;
}
  • 属性和多值选择器

为title中包含指定值的所有元素设置样式。

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

使用:

<h2 title="hello world">Hello world</h2>
<h1 title="every hello">Hello everyone</h1>

效果:

技术分享

  

CSS笔记(二)CSS属性选择器

原文:http://www.cnblogs.com/AmitX-moten/p/4846422.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!