这是什么CSS选择器？ [*级=“跨度”]

151

我看到这个选择在Twitter的引导：这是什么CSS选择器？ [*级=“跨度”]

.show-grid [class*="span"] { 
    background-color: #eee; 
    text-align: center; 
    border-radius: 3px; 
    min-height: 30px; 
    line-height: 30px; 
}

有谁知道这种技术被称为和它做什么？

来源

2012-03-23 jon

http://api.jquery.com/attribute-contains-selector/ – biziclop 2012-03-23 08:43:27

许多很酷的CSS选择器可用：http://www.w3.org/TR/selectors/#selectors – 2012-03-23 08:46:11

http://jsbin.com/otizoz /编辑＃的JavaScript，HTML，生活 – 2012-03-23 08:48:18

267

这是一个属性通配符选择器。在您给出的示例中，它会查找.show-grid下的任何子元素，其类别包含span。

所以会选择此例中的<strong>元素：

<div class="show-grid"> 
    <strong class="span6">Blah blah</strong> 
</div>

你也可以做搜索“开始......”

div[class^="something"] { }

这将在这样的工作： -

<div class="something-else-class"></div>

和

'与......结束' 0

div[class$="something"] { }

这将在

<div class="you-are-something"></div>

很好的参考

工作

来源

2012-03-23 08:43:53 isNaN1247

我知道这是旧的答案，但我会将此参考添加到参考列表中： http：//www.w3。org/TR/css3-selectors/ – 2015-04-17 18:39:27

@DreadBoy谢谢，我现在添加 – isNaN1247 2015-04-18 18:29:20

想添加另一个参考，以防万一人发现这个有用：http://AllCssSelectors.com – user3339411 2015-07-07 05:44:33

.show-grid [class*="span"]

这是选择具有类秀网，有一个子元素谁是类的所有元素的CSS选择器包含名称跨度。

来源

2012-03-23 08:45:15 Spikeh

+12

以上的某个类名，它选择“包含名称范围的类的子元素”和**不**“具有类表示格的所有元素” – Utopik 2014-04-12 15:51:17

它选择某个地方的类名包含字符串"span"的所有元素。字符串的开头也有^=，字符串的末尾有$=。下面是一些CSS选择一个很好的参考：http://net.tutsplus.com/tutorials/html-css-techniques/the-30-css-selectors-you-must-memorize/

我只熟悉自举类spanX其中X是一个整数，但如果有其它选择的是在span结束，它也将属于这些规则。

它只是有助于应用一揽子CSS规则。

来源

2012-03-23 08:48:33

这是什么CSS选择器？ [*级=“跨度”]

回答

相关问题