在 CSS3 中，追加了三个属性选择器分别为：

[att*=val] ----内容包含

[att^=val] ----开头匹配

[att$=val] ----结尾匹配

示例：

<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title></title>

   <style>

       [id*=box]{

           background: #75d8ff;

       }

       [id^=box]{

           background: #ff0000;

       }

       [id$=blue]{

           background: blue;

       }

   </style>

</head>

<body>

实例1:

    <div id="box1">sdf</div>

    <div id="2box">sdf</div>

    <div id="box3blue">sdf</div>

</body>

</html>

CSS3通配符的更多相关文章

  1. CSS3属性选择通配符

    CSS3增加了更多的CSS选择器,可以实现更简单但是更强大的功能,比如:nth-child()等. Attribute selectors:在属性中可以加入通配符,包括^,$,* [att^=val] ...

  2. 神通广大的CSS3选择器

    每个前端工程师可能每天都会写一些css,其中选择器是很主要的一部分.但是,大家可能每天写的大多是#id,.class这样的选择器,这并不稀奇,但是如果我们了解并且熟用css3为我们提供的强大并且优雅的 ...

  3. CSS3与页面布局学习总结（一）——概要、选择器、特殊性与刻度单位

    web前端开发者最最注的内容是三个:HTML.CSS与JavaScript,他们分别在不同方面发挥自己的作用,HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能 ...

  4. CSS3选择器——基本选择器

    CSS是一种用于屏幕上渲染html,xml等一种语言,CSS主要是在相应的元素中应用样式,来渲染相对应用的元素,那么这样我们选择相应的元素就很重要了,如何选择对应的元素,此时就需要我们所说的选择器.选 ...

  5. CSS3 选择器——基本选择器

    CSS的选择器,我想大家并不会陌生吧,因为天天在使用,但对于CSS3的选择器,要运用的灵活到位,我想对很多朋友还是一定的难度,特别是CSS3中的:nth选择器.那么从现在开始我们先丢开他们版本的区别, ...

  6. 十天精通CSS3学习笔记 part2

    第6章 征服CSS3选择器(上) 属性选择器 在HTML中,通过各种各样的属性可以给元素增加很多附加的信息.例如,通过id属性可以将不同div元素进行区分. 在CSS2中引入了一些属性选择器,而CSS ...

  7. CSS3与页面布局学习笔记（一）——概要、选择器、特殊性与刻度单位

    web前端开发者最最注的内容是三个:HTML.CSS与JavaScript,他们分别在不同方面发挥自己的作用,HTML实现页面结构,CSS完成页面的表现与风格,JavaScript实现一些客户端的功能 ...

  8. css3选择器（一）

    直接开始正文. 一.css3同级元素通用选择器[update20161228] 选择器:E~F 匹配任何在E元素之后的同级F元素 Note:E~F选择器选中的是E元素后面同级元素中的全部F元素. 例: ...

  9. 《CSS3实战》读书笔记 第三章：选择器：样式实现的标记

    第三章:选择器:样式实现的标记 选择器的魔力在于,让你完全实现对网页样式的掌控.不同的选择器可以用在不同的情况下使用.总之把握的原则是:规范的编码,根据合理地使用选择器,比去背选择器的定义有价值的多. ...

随机推荐

  1. JAVA类与对象（六）------实例变量与类变量的区别，实例方法和类方法的区别

    实例变量 实例变量声明在一个类中,但在方法.构造方法和语句块之外: 当一个对象被实例化之后,每个实例变量的值就跟着确定: 实例变量在对象创建的时候创建,在对象被销毁的时候销毁: 实例变量的值应该至少被 ...

  2. Team Homework #2 Decide the roles of each team member ——IloveSE

    大家好,我们是IloveSEers! 徐姗,我是一个性格开朗,但却认为计算机比较枯燥的女生.经过两年的学习,自己的编程能力,并不是很强,在这方便还需多多练习.对于软件工程这门课,我充满期待,因为我不仅 ...

  3. 程序开发心理学阅读笔记——第II篇

    作为社会行为的软件开发程序开发组->程序开发团队->程序开发项目1.要判断程序员的某个集体是否构成一支团队,要看其中的成员以何种方式相互协作,以共同开发软件产品.2.健康的团队要始终能够保 ...

  4. java数组元素的输出

    java数组元素的输出 利用Arrays.toString(数组名即可) String[] name = {"Tom", "John", "Nike& ...

  5. Xamarin.Android之转换，呼叫，查看历史纪录

    Xamarin.Android之转换,呼叫,查看历史纪录 E文文章. 功能:能将输入的字母转换成相应的数字.并且能呼叫出去.能查看呼叫的历史纪录. 界面代码如下: <?xml version=& ...

  6. 不同平台下Java环境变量的设置

    http://www.java.com/en/download/help/path.xml

  7. cygwin chmod 失效

    问题背景 为了在 Cygwin 下使用之前最喜爱的 screen 命令, 安装 Cygwin 时就选上了 screen 来运行一把 ganiks.liu@MAMIS-Gaiks-Liu /tmp $ ...

  8. hdu 1533 Going Home 最小费用最大流

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1533 On a grid map there are n little men and n house ...

  9. 【POJ】【1160】Post Office

    DP/四边形不等式 邮局,经典的四边形不等式例题! 关于四边形不等式的学习请看 赵爽论文<动态规划加速原理之四边形不等式> 题目总结&题解:http://blog.csdn.net ...

  10. jquery ajax清除缓存的方法

    function cityListChange(cityCode){ //{lon=121.491121, name=上海, province=上海市, telPrefix=021, province ...