有沒有方法可以爲類組合定義樣式?例如,我想我的HTML看起來像這樣,但輸出到適當的色彩渲染:爲類組合定義樣式
<span class="red">Red Text</span><br/>
<span class="green">Green Text</span><br/>
<span class="red green">Yellow Text</span><br/>
編輯:上面似乎是混亂的人時,這只是一個例子;所以這裏是另外一個例子:
<style>
.style1 { background-color: #fff; }
.style2 { background-color: #eee; }
.style1.highlight { color: red; }
.style2.highlight { color: blue; }
</style>
<ul>
<li class="action style1">Do Action 1</li>
<li class="action style2">Do Action 2</li>
<li class="action style1 highlight">Do Action 1</li>
<li class="action style2 highlight">Do Action 2</li>
</ul>
<script language="javascript" type="text/javascript">
$("li.action").bind("click", function(e) {
e.preventDefault();
// Do some stuff
$(this).addClass("highlight");
$(this).unbind("click");
});
</script>
同樣,這僅僅是一個例子,所以不要在交替的元件或類似的東西掛了。我試圖避免的是必須複製每個不同styleN的綁定函數,或者必須編寫一個檢查每個styleN類的elseif結構。不幸的是,這個代碼在IE 6或7中不起作用 - .style1和.style2元素的高亮文本最終變爲藍色。
嗯......在IE7中似乎也沒有工作(綠色跨度是黃色的),這是一種交易斷路器。 – Soldarnal 2008-12-11 19:05:18
IE將此解析爲OR不是AND - 即它將匹配具有「綠色」類的任何元素。你可以用正確的設計來解決這個問題,但並非總是如此。如果你能給我們一個特定的目標,我們可能能夠解決這個問題。 – annakata 2008-12-11 20:53:49