這是什麼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選擇器？ [*級=「跨度」]

回答

相關問題