CSS selector? [class*=“span”]怎么理解
我在Twitter 中有看到如下selector:
.show-grid [class*="span"] {
background-color: #eee;
text-align: center;
border-radius: 3px;
min-height: 30px;
line-height: 30px;
}
有哪位童鞋知道这种写法.
答: 这是一个属性通配符selector. 在你提供的例子中, 会在引用了.show-grid 样式的容器内查找包含span样式的任何元素并设置对应的样式
下面这个例子中, 将会找到 <strong>
组件.
<div class="show-grid">
<strong class="span6">Blah blah</strong>
</div>
你也可以定义'以... 开始'的样式, 例如:
div[class^="something"] { }
将会查找到如下的组件:-
<div class="something-else-class"></div>
亦可以定义 '以...结尾'
div[class$="something"] { }
将会查找到如下组件
<div class="you-are-something"></div>
原文地址:
What is this CSS selector? [class*=“span”]
CSS selector? [class*=“span”]怎么理解的更多相关文章
- 由css reset想到的深入理解margin及em的含义
由css reset想到的深入理解margin及em的含义 原文地址:http://www.ymblog.net/content_189.html 经常看到这样语句,*{ margin:0px;pad ...
- [译文]通过ID, TagName, ClassName, Name, CSS selector 得到element
致谢原文: <http://xahlee.info/js/js_get_elements.html> 通过ID得到element: Document.getElementById(id s ...
- CSS魔法堂:深入理解line-height和vertical-align
前言 一直听说line-height是指两行文本的基线间的距离,然后又说行高等于行距,最近还听说有个叫行间距的家伙,@张鑫旭还说line-height和vertical-align基情四射,贵圈真乱啊 ...
- Selenium - CSS Selector
Selenium - CSS Selector http://www.cnblogs.com/bugua/archive/2012/08/16/2641647.html 昨天我练习了用CSS(即层 ...
- 转:Selenium之CSS Selector定位详解
CSS selector定位 CSS(Cascading Style Sheets)是一种语言,它被用来描述 HTML 和 XML 文档的样式. 百度输入框: <input name=&quo ...
- css selector
文章一: http://www.jb51.net/css/68287.html 去年我学jQuery的时候,曾经做过一点选择器(selector)的笔记,今天是CSS的选择器,以后还有一部分xPath ...
- Scrapy学习系列(一):网页元素查询CSS Selector和XPath Selector
这篇文章主要介绍创建一个简单的spider,顺便介绍一下对网页元素的选取方式(css selector, xpath selector). 第一步:创建spider工程 打开命令行运行以下命令: sc ...
- css selector: xpath:
css selector: $$(".mainLeft>div>h1") xpath: $x(".mainLeft>div>h1") n ...
- Selenium 使用css selector (资源来源于网络)
Selenium - CSS Selector 昨天我练习了用CSS(即层叠样式表Cascading Stylesheet) Selector来定位(locate)页面上的元素(Elements).S ...
随机推荐
- DM7的SQL批量插入for、while方法
示例1,for用法: begin for i in 1...10000 loop insert into test values(i,i,'aaa',sysdate); if i mod 20 = 0 ...
- @Configuration结合@Bean实现对象的配置
@Configuration结合@Bean实现对象的配置 前提:最近项目中需要做支付接口,支付宝以及微信支付,本文并不介绍如何写支付接口,而是通过这个示例讲解配置应该怎么写,项目中使用的是Kotlin ...
- Java开发中的各种乱码问题
乱码问题 其实解决乱码问题,就是保证所有的编码格式一致,就不会出现问题. 控制台乱码 修改idea的控制台格式 修改 idea.exe.vmoptions和idea64.exe.vmoptions 在 ...
- 更好用的 Python 任务自动化工具:nox 官方教程
英文| nox tutorial 出处| nox 官方文档 译者| 豌豆花下猫@Python猫 Github地址:https://github.com/chinesehuazhou/nox_doc_c ...
- Oracle Autonomous Health Framework (AHF) 解读
AHF介绍 Oracle在2019年10月18日发布自治健康框架Autonomous Health Framework (AHF) 19.3,将ORAchk,EXAchk,TFA三种诊断工具合并入AH ...
- mysql 行增删改查
一.增 ); ),(); insert into student(name, age) select name, age from info; 二.删 delete from db1; delete ...
- ORM跨表查询总结
一.基于对象的查询-->子查询 1.一对多 正向查询:基于 字段 反向查询:基于 表名__set.all() 注意:表名全部小写 2.多对多 正向查询:基于 字段.all() 反向查询:基于 表 ...
- 把 CPU “玩”起来
前言 从开始学习编程之后,就渐渐痴迷于技术,平时遇到购书满减活动时就忍不住买一堆书.前两天闲着无聊,翻开了去年买的<编程之美>,目录里的“让 CPU 占用率听你指挥”吸引力我的眼球.这一年 ...
- java小心机(4)| 继承与组合的爱恨情仇
在java中,有两种主要复用代码的方法:继承和组合. 继承,是OOP的一大特性,想必大家都非常熟悉了;组合,其实也很常见,只是不知道它的名字罢了. 继承 子类拥有父类的基本特性,需使用extend关键 ...
- 5分钟搭建网站实时分析:Grafana+日志服务实战
原文地址:https://yq.aliyun.com/articles/227006 阿里云日志服务是针对日志类数据一站式服务,用户只需要将精力集中在分析上,过程中数据采集.对接各种存储计算.数据索引 ...