在 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. ERP系统实施与企业内部控制管理实践

    COSO内部控制体系包含5 个要素,分别为控制环境.风险评估.控制活动.信息与沟通.监督,涉及公司层面的控制.业务活动的控制以及信息系统总体控制.随着ERP系统的上线运行,企业的内部控制体系建设应与E ...

  2. 《梦断代码》读书笔记第0篇——“软件时间”、“死定了”、“Agenda之魂“

    第0章  软件时间 在未读这本书前,刚看到名字觉得是本讲代码的书,后来老师说是一个个的故事,这引起了我的兴趣,于是我便速速开始了第0章的阅读,读完一遍大概能读懂在讲什么,可能由于是译过来的书,书里面一 ...

  3. 单元测试篇----cppUnit的安装与使用

    在刚学习单元测试章节的时候,尝试着使用dev—c++来编译cppunit,但一直没成功,也尝试问过同学,一直没有很好的方法,因此浪费了不少时间.今天又耐心的尝式一下,意外成功了.以下是详细的安装步骤: ...

  4. mui开发webapp(2)

    前端开发APP,从HBuilder开始~ 序 通过 HTML5 开发移动App 时,会发现HTML5 很多能力不具备.为弥补HTML5 能力的不足,在W3C 中国的指导下成立了www.HTML5Plu ...

  5. 21、HierarchyViewer使用记录

    1.是啥 HierachyViewer是一种能够方便开发人员了解activity中的布局信息的工具. 2.异常 HierachyViewer在未root过的设备或者低版本的设备是无法使用的 3.怎么办 ...

  6. 开发EXTMVC框架前需要了解的基础知识整理

    1.组件选择器 目的:了解如何选择Extjs中的组件,就跟学习jquery时一定会先要学习:$()选择器一样. 常用场景:       1.在controller中的control事件中用到      ...

  7. JS学习笔记-1--基本知识和注意事项

    1.JS开始的目的主要是验证表单的输入验证 2.是一种具有面向对象能力的.解释型语言.是基于事件驱动的相对较安全的客户端脚本语言 3.JS 特点:松散型:变量不具备一个明确的类型:   对象属性:把属 ...

  8. Vim配置文件（Vimrc）

    嘛……后面的比赛基本都是在NOI Linux下进行了,windows下的开发环境基本都不能用了>_>果断转了vim,记录一下vim的配置文件- set nu syntax on filet ...

  9. Codeforce 438D-The Child and Sequence 分类： Brush Mode 2014-10-06 20:20 102人阅读 评论(0) 收藏

    D. The Child and Sequence time limit per test 4 seconds memory limit per test 256 megabytes input st ...

  10. 说说php取余运算(%)的那点事

    http://www.phpddt.com/php/php-take-over.html       fmod()与 % 区别   都是取余 fmod是函数 原型float fmod(float x, ...