如何定位具有CSS中任何值的屬性的元素？

我知道，我可以針對其在CSS一特定屬性的元素，例如：如何定位具有CSS中任何值的屬性的元素？

input[type=text] 
{ 
    font-family: Consolas; 
}

但有可能的目標具有任何價值的屬性元素（除了沒有即當屬性沒有被添加到元素）？

大致是這樣的：

a[rel=*] 
{ 
    color: red; 
}

其中應針對第一和第三<a>標籤在此HTML：

<a href="#" rel="eg">red text</a> 
<a href="#">standard text</a> 
<a href="#" rel="more">red text again</a>

我想，這是可能的，因爲在默認情況下，cursor: pointer似乎也適用於任何<a>標籤，其值爲href屬性。在CSS

a[rel] 
{ 
    color: red; 
}

http://www.w3.org/TR/CSS2/selector.html#pattern-matching

來源

2012-02-14 Marty

以下將匹配任何a nchor與定義的rel屬性。

E.g.

[ATT] 表示與ATT屬性的元素，屬性的任何的值。

[att = val] 表示具有att屬性的元素，其值完全是「val」。

[ATT〜= VAL] 表示與ATT屬性，其值是詞的空格分隔的列表，其中一個是完全「VAL」的元素。如果「val」包含空格，它將永遠不會表示任何內容（因爲單詞之間用空格分隔）。另外，如果「val」是空字符串，它將永遠不會代表任何內容。

[att^= val] 表示具有att屬性的元素，其值以前綴「val」開頭。如果「val」是空字符串，則選擇器不表示任何內容。

[att $ = val] 表示具有att屬性的元素，其值以後綴「val」結尾。如果「val」是空字符串，那麼選擇器不代表任何內容。

[ATT * = VAL] 表示與ATT屬性值中包含子串「VAL」的至少一個實例的元件。如果「val」是空的字符串，那麼選擇器不會表示任何內容。

來源

2012-02-14 03:49:32 xandercoded

啊，那工作 - 不知道爲什麼我沒有想到的它。謝謝！ – Marty 2012-02-14 03:50:28

是3個選擇有幾個attribute selectors：

來源

2012-02-14 03:51:18 Daff

應該補充的是，如果瀏覽器默認設置屬性，您可能需要解決。這在「現代」大雜燴中似乎沒有問題，但是，這是我看到的問題，因此請務必檢查跨瀏覽器的性能。

例如，我發現，在IE之前的9，合併單元格設置爲所有TD在一個表，所以任何一個單元有1

所以隱藏合併單元格的值，如果你被靶向「任何TD如果你在你的webdoc中應用了colspan屬性，那麼即使是沒有colspan屬性集的td，比如任何TD都是單個單元格，都將接收到css樣式。小於9的IE基本上將它們全部風格化！

只有理由擔心這是所有剩餘的XP用戶誰不能升級超過IE8。

因此，例如，我有一組表格，其中的內容可能會從頭到尾轉移，留下1到7個單元格的任何空白，無論是在結尾還是開頭。

我想使用colspan屬性將顏色應用到結束處或開始處的任何空白單元格。使用以下不會在IE低於9

#my td[colspan] {background-color:blue;}

工作......所有TD的將獲得風格（有趣的，因爲條件屬性的造型是在IE中所謂優越，但我離題...）。

當我爲任何孤立單元/ TD設置colspan的值爲'single'時，在所有瀏覽器中使用以下工作我希望包含在樣式方案中，但是它的'hack'並不會正確驗證。

#my td[colspan="single"] {background-color:blue;} /* 'single' could be anything */ 
#my td[colspan="2"] {background-color:blue;} 
#my td[colspan="3"] {background-color:blue;} 
#my td[colspan="4"] {background-color:blue;} 
#my td[colspan="5"] {background-color:blue;} 
#my td[colspan="6"] {background-color:blue;} 
#my td[colspan="7"] {background-color:blue;}

或者，您應該能夠更合適地解決使用條件樣式使用「if lt IE 9」來覆蓋的問題。這將是正確的方法，請記住，在進程中必須隱藏IElt9中「正確構建的CSS」，我認爲唯一正確的方法是使用選擇性樣式表。

我們大多數人已經做到這一點，無論如何，但無論如何，你還是好好考慮和測試一個瀏覽器應用，當它看到沒有自動屬性，以及它如何處理你的，否則corect語法屬性值的造型。

（順便說一句，列跨度恰好不是在CSS規範尚未[如CSS3的]，所以這個例子沒有拋出驗證錯誤。）

來源

2013-07-04 20:42:33 TwoHawks

*>只有理由擔心這是所有剩餘的XP用戶，無法升級到IE8以上。*您會認爲，直到您遇到與Win7上的IE8的企業環境。 – Bob 2015-02-02 05:55:28

如何定位具有CSS中任何值的屬性的元素？

回答

相關問題