2012-04-21 51 views
2

有沒有任何CSS選擇器(CSS3 +很好),當只有一次發生時,會將某些樣式應用於元素?只有一次發生時纔將CSS應用於元素?

例如,下面的CSS規則:

border: 1px solid black; 

...只適用於.INFO若存在只有一個發生.INFO在HTML

所以,

<p class="info">This would have a border because there is only one</p> 

,並

<p class="info">This would not have a border because there are two</p> 
<p class="info">And neither would this</p> 

我猜我將不得不要麼編程應用其它類如:。單發生或計數用Javascript發生的次數?

編輯:

讓我清楚了一些東西了。

當我提到Javascript作爲我想要做的解決方案 - 這並不意味着我要使用它。我試圖避免JS不是任何行爲。所以我不想要Javascript的答案,這非常容易完成 - 我的問題是關於CSS。

此外,對那些感到困惑:爲什麼會有有時僅僅是一個單一的頁面上類的原因,是因爲我使用的實際類是:搜索結果。有時候只會有一個結果。但僅僅因爲只有一個並不意味着該項目不能被稱爲搜索結果的對象類的一部分。語義上(和邏輯上),當然可以有一個類的一個項目。有時候,我認爲人們應該多思考一下語義,而不是應用一攬子規則。

+1

我堅信沒有符合您問題要求的解決方案。在規範或實際實現中,CSS根本不提供這種情況。 – michaelward82 2012-04-22 03:29:41

+0

@ michaelward82。謝謝,我很懷疑。 – 2012-04-22 03:35:00

回答

4

根據您的網頁結構,您可能能夠使用:only-of-type僞類,如果該元素沒有相同標籤名稱的兄弟,則匹配。我認爲沒有辦法獲得比這更具體的內容。

+0

這似乎工作。所以現在當只有一個搜索結果時,我可以這樣設計它:#search-results .search-result:only-of-type {border:0; } – 2012-04-22 08:25:52

0

這沒有CSS解決方案。我會用你的JavaScript想法去。如果你使用jQuery,您可以使用類似:

$('.info').length 

這裏CSS3僞類的列表:http://reference.sitepoint.com/css/css3psuedoclasses

+0

再次... http://stackoverflow.com/questions/2826791/am-i-using-too-much-jquery-when-am-i-crossing-the-line/2826810#2826810 – 2012-04-21 17:07:54

+2

@Truth,而我感謝您對過度使用jQuery的關注,我建議這個解決方案作爲1個選項,以防他已經在使用jQuery。當然,有[其他圖書館](http://javascriptlibraries.com/)在那裏,他可能會使用,但我不打算爲每個人發佈一個例子。爲什麼要使用圖書館?當然,創建你自己的['getElementsByClassName'](http://ejohn.org/blog/getelementsbyclassname-speed-comparison/)函數。但所有這些都是OP的特權。 – 2012-04-21 18:11:52

-1

這個怎麼樣的解決方案。

CSS

.info.highlight { border: 1px solid black } 

的JavaScript(使用jQuery

var $info = $('.info'); 
if ($info.length === 1) { $info.addClass('highlight'); } 

示範:http://jsfiddle.net/joshdavenport/YdbuB/

+4

-1。 OP表示他正在尋找一個CSS選擇器。他還提到他知道,如果沒有人,他將不得不訴諸於JavaScript。不僅你把JavaScript放在了[tag:css]問題上,你也把jQuery放在了! http://stackoverflow.com/questions/2826791/am-i-using-too-much-jquery-when-am-i-crossing-the-line/2826810#2826810 – 2012-04-21 17:00:24

+0

我的問題是關於CSS,JavaScript不。不過謝謝。 – 2012-04-22 03:27:22

相關問題