一、属性选择器

1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如:

//所有以名称g_开头的div的字体颜色为红色
div[name^="h_"]{
color:rted;
}

2.E[foo$="bar"]:选取属性以bar结尾的元素,如:

//所有以名称_h结尾的div的边框宽度为2px
div[name$="h_"]{
border:2px;
}

3.E[foo*="bar"]:选取属性中含有val值的元素,如:

//所有div中名称包含red的字体颜色为红色
div[name*="red"]{
color:red;
}

注:多个属性选择器并列是and关系

晨读笔记:CSS3选择器之属性选择器的更多相关文章

  1. CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  2. 深入学习jQuery选择器系列第四篇——过滤选择器之属性选择器

    × 目录 [1]简单属性 [2]具体属性 [3]条件属性 前面的话 属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素,对应于CSS中的属性选择器.属性过滤选择器可分为简单属性选择器.具体属性选 ...

  3. jQuery选择器之属性选择器Demo

    测试代码: 06-属性选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

  4. html 选择器之属性选择器

    属性选择器的主要作用个人的理解就是对带有指定属性的元素设置css样式. 使用css3的属性选择器,可以指定元素的某个属性,也可以指定某个属性和这个属性所对应的值. css3的属性选择器主要包括下面几种 ...

  5. jquery选择器之属性选择器

    [attribute]   匹配指定属性名的所有元素 [attribute=value] 匹配给定的属性名是某个特定值的属性 [attribute!=value] 匹配给定的属性名不是某个特定值的属性 ...

  6. CSS选择器之基本选择器+属性选择器

    1.1      id选择器 #main{ font-size:12px; margin:0; padding:0; } 其中的#main就是id选择器,用于选择HTML页面中id = "m ...

  7. CSS 选择器之基本选择器 属性选择器 伪类选择器

    CSS 选择器 常见的选择器列表图 CSS选择器笔记 基本选择器 通配符选择器(*) 元素选择器(E) 类选择器(.className)    所有浏览器都支持类选择器,但多类选择器(.classNa ...

  8. jquery选择器之属性过滤选择器

    <style type="text/css"> /*高亮显示*/ .highlight{ background-color: gray } </style> ...

  9. jquery选择器之属性过滤选择器详解

    代码如下: <style type="text/css">  /*高亮显示*/  .highlight{       } </style> 复制代码代码如下 ...

随机推荐

  1. Spring MVC数据绑定入门总结

    1.基本类型 基本类型参数不可为空 正例:http://localhost:8080/demo/he?id=2 反例:http://localhost:8080/demo/he?id=(报400错误) ...

  2. List对象去重碎碎念之神叨叨

    前言 List集合操作去除重复数据的这种情况经常会碰到,博客园里面也有很多大神们做过,在这里主要是借鉴然后自己整理了一下,主要是为了方便自己,以后再次碰到这种去重问题,直接打开自己的链接拿起键盘就是干 ...

  3. Node.js api接口和SQL数据库关联

    数据库表创建 服务器环境配置.连接 .操作.数据库 API接口  原则:

  4. (第十三周)Final阶段用户调查报告

    项目名:食物链教学工具 组名:奋斗吧兄弟 组长:黄兴 组员:李俞寰.杜桥.栾骄阳.王东涵 用户调查报告 调查时间:2016年12月1日  21:00——2016年12月3日  12:00 项目分享链接 ...

  5. Feel Good POJ - 2796 (前缀和+单调栈)(详解)

    Bill is developing a new mathematical theory for human emotions. His recent investigations are dedic ...

  6. 各种jar包

    springframework下载地址:http://maven.springframework.org/release/org/springframework/spring/ commons开头的j ...

  7. 软工网络15团队作业7——Alpha冲刺之事后诸葛亮

    Deadline: 2018-5-16 22:00PM,以博客提交至班级博客时间为准 事后诸葛亮分析 Alpha冲刺,很多同学经历了"Learning by doing"的学一门新 ...

  8. 使用log4j记录日志

    目录 log4j的优点 导入log4j的jar包 log4j的错误级别 log4j日志的输出目的地 log4j的配置示例 log4j的全局配置讲解 控制台日志的配置讲解 日志输出文件的配置讲解 使用l ...

  9. 学习PHPExcel

    关于PHPExcel使用方法,可以参考慕课网的教程,链接在此 PHPExcel的github地址:https://github.com/PHPOffice/PHPExcel 下载之后,将文件夹中的Cl ...

  10. vue学习的笔记补充

    // vue-router中可以使用 routes:[ { path:'/', name:'index', component:()=>import('./index') } ] // 这种写法 ...