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”]

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。