CSS3选择器的第二部分——属性选择器。。

属性选择器早在CSS2中就被引入了,其主要作用就是对带有指定属性的HTML 元素设置样式

使用CSS3属性选择器,你可以只指定元素的某个属性,或者你还可以同时指定元素的某个属性和其对应的属性值。

CSS3的属性选择器主要包括以下几种:
  1. E[attr]:只使用属性名,但没有确定任何属性值;
  2. E[attr="value"]:指定属性名,并指定了该属性的属性值;
  3. E[attr~="value"]:指定属性名,并且具有属性值,此属性值是一个词列表,并且以空格隔开,其中词列表中包含了一个value词,而且等号前面的“〜”不能不写;
  4. E[attr^="value"]:指定了属性名,并且有属性值,属性值是以value开头的;
  5. E[attr$="value"]:指定了属性名,并且有属性值,而且属性值是以value结束的;
  6. E[attr*="value"]:指定了属性名,并且有属性值,而且属值中包含了value;
  7. E[attr|="value"]:指定了属性名,并且属性值是value或者以“value-”开头的值(比如说zh-cn);

CSS3选择器(二)之属性选择器的更多相关文章

  1. Selectivizr-让IE6~8支持CSS3伪类和属性选择器

    一.下载和demo 下载: 您可以狠狠地点击这里:selectivizr-1.0.0.zip(右键-[目标|链接另存为] 9.24K) demo: 您可以狠狠地点击这里:Selectivizr部分属性 ...

  2. css:id选择器的权重>class选择器的权重=属性选择器的权重>元素选择器

    最近的项目要自己写前端了,重新学习下前端的一下基本知识. 一般在css样式表中,上面的会被下面的覆盖,如下图,文字会显示蓝色: 所以按照正常的来说,下面的css样式,测试的文字应该还是蓝色 但结果,测 ...

  3. js实现类选择器和name属性选择器

    jQuery的出现,大大的提升了我们操作dom的效率,使得我们的开发更上一层楼,如jQuery的选择器就是一个很强大的功能,它包含了类选择器.id选择器.属性选择器.元素选择器.层级选择器.内容筛选选 ...

  4. css选择器学习(二)属性选择器

    属性选择器 /*******************************************css2中的属性选择器*************************************** ...

  5. Html学习之八(CSS选择器的使用--属性选择器)

    一.前缀属性选择器 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...

  6. 1-1:CSS3课程入门之属性选择器

    div[name=jewave] 选取属性名为name且属性值是"jewave"的元素 div[name^=jewave]选取属性名为name且属性值以"jewave&q ...

  7. CSS3 选择器——笔记+实战案例(基本选择器、组合选择器、属性选择器、伪类选择器)

    使用CSS3 选择器——笔记 CSS通过选择器控制HTML元素,CSS选择器对网页对象可以实现一对一.一对多或者多对一的匹配. 一.CSS3选择器分类 CSS选择器在CSS2.1选择器的基础上新增了属 ...

  8. 【CSS3】---属性选择器

    在HTML中,通过各种各样的属性可以给元素增加很多附加的信息.例如,通过id属性可以将不同div元素进行区分. 在CSS2中引入了一些属性选择器,而CSS3在CSS2的基础上对属性选择器进行了扩展,新 ...

  9. css3属性选择器总结

    前两节介绍了css3属性选择器与css2属性选择器中: 包含字符串和以字符串选择器开头的选择器的比较. 全部属性选择器: 包含字符串讲解对比实例讲解链接: http://www.cnblogs.com ...

随机推荐

  1. Django authentication 使用方法

    转自 : https://docs.djangoproject.com/en/1.8/topics/auth/customizing/

  2. 《ASP.NET1200例》<ItemTemplate>标签在html里面有什么具体的作用

    严格的来说 <ItemTemplate> 在html中无意义,他只是针对诸如 Repeater.DataList.GridView中的一个模板 至于里面的含义,你可以这样想,既然Repea ...

  3. css用标签选择器在本页写样式

    <title>静夜思</title><style type="text/css">p{ color:#ff0000;   font-size:2 ...

  4. 【转】Solr安全设置——对外禁用管理后台

    本文转自:http://www.devnote.cn/article/94.html 测试于:Solr 4.5.1, Jdk 1.6.0_45, Tomcat 6.0.37 | CentOS 5.7 ...

  5. swift init继承问题

    当在子类的 designated init方法中不手动调用 父类的 designated init方法时,如果父类有不接受任何参数的init,那么系统会自动调用它,编译器不会报错.但是如果父类中没有不 ...

  6. Android 中“TabBar”的背景拉伸问题

    在最近的一个工程中,要求有一个在上方了tabbar,上面有并排的3个方形按钮,每个按钮都有背景图.问题来了,如何让图片在不同尺寸的屏幕上不失真呢?(由于我们的项目比较小,工时很短,不能为每一个屏幕尺寸 ...

  7. win10远程桌面连接

    有的情况下,Win10设置了允许远程桌面连接后,远程主机仍然不能桌面连接到目标主机上,这时可以在目标主机上尝试如下修改: 开始-->运行->gpedit.msc->计算机配置-> ...

  8. Java for LeetCode 034 Search for a Range

    Given a sorted array of integers, find the starting and ending position of a given target value. You ...

  9. Oracle错误代码大全

    Oracle错误代码大全——最新.最全的Oracle错误代码 对快速查找oracle数据库错误原因很有帮助 ORA-00001: 违反唯一约束条件 (.) ORA-00017: 请求会话以设置跟踪事件 ...

  10. phpStorm支持CodeIgniter代码提示/自动完成

    下载这个文件phpstorm-ci-ac 或者去github下载解压里面的三个文件到ci根目录下然后找到这三个文件 system\core\Controller.phpsystem\core\Mode ...