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. linux自定义脚本添加到rc.local脚本无法正常运行的问题

    为了能科学地上网,你懂的.其中需要将服务端做成开机启动.然而脚本在secure crt下能正常运行,添加到/etc/rc.local下却无法正常启动服务.用ps查找了下,脚本是运行了,但服务没起来.于 ...

  2. 将文件放到Android模拟器的SD卡

    1.打开DDMS页面2.打开File Explorer页,如果没有,在Window –> Show View –>File Explorer3.一般就在mnt –> sdcard中4 ...

  3. Java for LeetCode 150 Evaluate Reverse Polish Notation

    Evaluate the value of an arithmetic expression in Reverse Polish Notation. Valid operators are +, -, ...

  4. codeforces A. Candy Bags 解题报告

    题目链接:http://codeforces.com/contest/334/problem/A 题意:有n个人,将1-n袋(第 i  袋共有 i  颗糖果,1<= i  <=n)所有的糖 ...

  5. Eclipse调试:F5、F6、F7、F8

    F5:跳入方法 F6:向下逐行调试 F7:跳出方法 F8:直接跳转到下一个断点 转载自:http://blog.sina.com.cn/s/blog_6271df6f0101d856.html

  6. js如何往数组Array中添加元素

    转载自:http://blog.sina.com.cn/s/blog_95fa28e60101mwup.html unshift:将参数添加到原数组开头,并返回数组的长度  pop:删除原数组最后一项 ...

  7. OC内存管理--zombie对象

    当我们对于内存进行手动管理的时候,会出现两种错误:一种是野指针错误,一种则为内存泄露.这两点也是我们去管理内存时最终要解决的问题. 内存泄漏是指:不在使用的对象,一直保留在内存中未被销毁,一直占有着内 ...

  8. Android之自定义控件深入

    本文主要讲述两个知识点:popwindow的使用和通过继承View实现一个自定义控件,实现点击,手动按钮的效果. popwindow的使用 //定义 popupWindow popWin = new ...

  9. Redhat修改主机名_Red hat怎么永久修改主机名hostname(转)

    有几种方式修改Redhat的主机名字,这些方法也适合其他的Centos系统,下面介绍Red hat怎么永久修改主机名hostname的三种方法. 方法一: 说明"hostname" ...

  10. C#对XML进行操作(添加、修改)

    XML文档内容如下: <?xml version="1.0" encoding="utf-8"?> <root> <first i ...