編輯一個元素的類風格與其類名空間

Question

我正在創建一個tumblr他們，我必須編寫一個外部CSS文件，但我編輯CSS元素的CSS樣式有困難。

這它的結構：

<li class="post quote"> 
    {other code} 
</li> 

的問題是，類名中有一個空格。

我該如何創建一個CSS類來訪問它？是的，我知道我可以在元素標籤中添加一個樣式屬性，但我希望有另一種選擇。

Answer 1

問題是類名中有一個空格。

這在CSS中是不可能的。你在做什麼是給元素兩個類。

可以解決這些問題，例如：

.post.quote { .... } 

但在你的情況下，它可能會更好使用一個有效分隔符像

post_quote 

Answer 2

這個元素實際上有類 - 它被標記與post類和類quote類。所以，你可以使用下面的選擇器來訪問它：

// css 
.post { ... } // elements with the post class 
.quote { ... } // elements with the quote class 

// jQuery 
var postLis = $('.post'); 
var quoteLis = $('.quote'); 

您也可以疊加選擇，通過包括不同的選擇一起返回符合在選擇所有條件的所有元素：

// css 
.post.quote { ... } // elements with both the post and quote classes 

// jQuery 
var postAndQuoteLis = $('.post.quote'); 

Answer 3

這可能工作：

$('li').each(function() {  
    if($(this).attr('class').indexOf(" ")>-1) { 
     $(this).css('border','1px solid #ff0000') 
    } 
}