这是css属性选择器的一种:[attribute^=value] ,用来匹配属性值以指定值开头的每个元素。例如:

[class^="test"] { background:#ffff00; }

表示设置 class 属性值以 "test" 开头的所有元素的背景色,也就是说对class="test", class="test1" class="test-001"的元素都是有效的。

除此之外,还有一些常用的css属性选择器如下:

  • [attribute~=value] 选取属性值中包含指定词汇的元素

  • [attribute|=value]  选取带有以指定值开头的属性值的元素,该值必须是整个单词。

  • [attribute$=value] 匹配属性值以指定值结尾的每个元素

  • [attribute*=value] 匹配属性值中包含指定值的每个元素

属性选择器 [attribute^=value] [attribute~=value] [attribute|=value] [attribute*=value]的更多相关文章

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

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

  2. css3属性选择器总结

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

  3. (3)选择元素——(6)属性选择器(Attribute selectors)

    Attribute selectors are a particularly helpful subset of CSS selectors. They allow us to specify an ...

  4. jQuery中的属性过滤选择器(四、五):[attribute] 、[attribute=value]、[attribute!=value] 、[attribute^=value] 等

    <!DOCTYPE html> <html> <head> <title>属性过滤选择器</title> <meta http-equ ...

  5. 基于.Net Framework 4.0 Web API开发(3):ASP.NET Web APIs 异常的统一处理Attribute 和统一写Log 的Attribute的实现

    概述:  ASP.NET Web API 的好用使用过的都知道,没有复杂的配置文件,一个简单的ApiController加上需要的Action就能工作.但是项目,总有异常发生,本节就来谈谈API的异常 ...

  6. sizzle分析记录:属性选择器

    源码部分 通过Sizzle.attr匹配出值 然后通过表达式刷选计算 "ATTR": function( name, operator, check ) { return func ...

  7. jquery属性选择器(同时匹配多个条件)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. jquery属性选择器

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jquery属性选择器(匹配具有指定属性的元素)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 1571. [Usaco2009 Open]滑雪课Ski

    传送门 可以想到 $dp$,设 $f[i][j]$ 表示当前等级为 $i$,时间为 $j$ 的最大滑雪次数 显然上课不会上让自己等级降低的课,所以第一维 $i$ 满足无后效性 然后直接枚举 $i,j$ ...

  2. 1.报表TIBCO Jaspersoft Studio工具教程入门--生成jrxml和jasper文件 然后拖拽到项目中 跟ireport一样

    转自:https://blog.csdn.net/KingSea168/article/details/42553781 2. 在接下来的教程中,我们将实现一个简单的JasperReports示例,展 ...

  3. post请求中的参数形式和form-data提交数据时取不到的问题

    @Controller页面form表单请求时不会丢数据返回json数据时需要加 注解@ResponseBody请求格式如下 @ResponseBody public Object login(Sign ...

  4. 如何用命令行启动android的模拟器(简要描述)

    参考来源 http://blog.sina.com.cn/s/blog_5033827f0101cxhz.html 环境前置条件: 已安装JDK,已下载并安装了SDK 1.查看已安装的SDK平台:an ...

  5. java 根据excel模板导出文件

    <!--读取excel文件,配置POI框架的依赖--> <dependency> <groupId>org.apache.poi</groupId> & ...

  6. Oracle 部门员工查询

    --部门:部门编号,部门名称,地址: --员工:员工编号,员工名字,职务,管理编号,入职日期,薪资,奖金,部门编号: CREATE TABLE dept( deptno INT PRIMARY KEY ...

  7. 「长乐集训 2017 Day8」修路 (斯坦纳树)

    题目描述 村子间的小路年久失修,为了保障村子之间的往来,AAA君决定带领大家修路. 村子可以看做是一个边带权的无向图GGG, GGG 由 nnn 个点与 mmm 条边组成,图中的点从 1∼n1 \si ...

  8. DIV 粘贴插入文本或者其他元素后,移动光标到最新处

    此文主要是可编辑div光标位置处理 1:首先 设置一个可编辑的DIV,注意:设置 contenteditable="true" 才可以编辑DIV <div id=" ...

  9. [CSP-S模拟测试]:联盟(搜索+树的直径)

    题目描述 $G$国周边的$n$个小国家构成一个联盟以抵御$G$国入侵,为互相支援,他们建立了$n−1$条双向通路,使得任意两个国家可以经过通路相互到达.当一个国家受到攻击时,所有其它国家都会沿着最短路 ...

  10. 前端每日实战:36# 视频演示如何利用 CSS 动画原理,在页面上表现日蚀现象

    效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/OELvrK 可交互视频教程 此视频 ...