將CSS子類添加到JavaScript中使用的CSS項目？

第一次使用CSS，所以我的問題可能沒有意義。我正在使用使用javascript來滑動CSS項目的菜單模板。我有多個項目彼此相鄰，我想通過爲項目創建子類來替換背景（例如：.cc_item .odd{background:#fff}）。將CSS子類添加到JavaScript中使用的CSS項目？

風格：

.cc_item{ 
    text-align: center; 
    width: 140px; 
    height: 600px; 
    float: left; 
    border-bottom: 1px solid #000; 
    background: #e8c486 url(../images/menuBack.jpg) repeat top left; 
    position: relative; 
    -moz-box-shadow: 3px -3px 10px #000; 
    -webkit-box-shadow: 3px -3px 10px #000; 
    box-shadow: 3px -3px 10px #000; 
}

HTML：

<div class="cc_item" style="z-index:6;"> 
    <img src="images/1.jpg" alt="image" /> 
    <span class="cc_title">Pizza</span> 
    <div class="cc_submenu"> 
     <ul> 
      <li class="cc_content_1">Pizzas</li> 
      <li class="cc_content_2">Calzones</li> 
     </ul> 
    </div> 
</div>

我想一個.odd{ }添加到cc_item所以在HTML我可以指定「奇」 cc_item類。我已經嘗試了幾件事情，但似乎無法讓它起作用。

我不知道向CSS項目添加子類的正確方法。我已經完成了我的表格樣式表，但「。」在cc_item面前拋出我（對不起......真的很新）。
我不知道在html中指定「class = odd」的位置。
我不知道我是否進行了這些更改，使用cc_item的javascript將會受到影響。

謝謝。

來源

2010-10-05 Jim D.

你可以給一個元素，像這樣多個類：

<div class="cc_item odd" style="z-index:6;">

用空格分開只是他們。

要引用代碼中使用CSS或jQuery的，你可以鏈一起上課，並指他們像這樣：

.cc_item.odd { /*styles go here*/ } or $('.cc_item.odd')

這將打擊與兩個類的任何信息。如果你想要這個工作在IE6，這裏閱讀說明： http://www.oppenheim.com.au/2009/05/24/multiple-css-classes-a-little-known-ie6-hack/

而且，只是一個供參考 - 當你使用jQuery的addClass()方法，它會自動添加類你之間的空間，因此，所有你需要通過是奇怪的類。

來源

2010-10-06 00:14:47 Marcus

謝謝。這完成了這項工作。我很感激。 – 2010-10-06 02:19:43

嘿！我喜歡這個！我不知道你可以把兩個類放在CSS中！ – 2010-10-06 12:26:38

我不認爲這是一個CSS子類的任何這樣的事情..但嘗試這個

添加新.cc_item_odd{...}現有關閉佈雷斯}後（我不只是把它.odd，因爲這是描述性較差因爲沒有小類，所以更容易發生衝突）

當你改變你的班級設置class="cc_item cc_item_odd"這就是你如何應用多個班級。我不知道你的JavaScript是怎麼做的查找，但我認爲這將是不受影響

來源

2010-10-05 23:17:26

感謝您的回覆。 – 2010-10-06 02:20:09

將CSS子類添加到JavaScript中使用的CSS項目？

回答

相關問題