2016-07-07 64 views
-1

我正在製作一個伴有演示頁面的主題庫。演示頁面必須使用庫中的樣式(用於演示),但不使用整個元素。有沒有一種方法可以對元素執行外部風格?

例如,採取以下風格; (外部樣式表)

div.major.minor { /* styling statements */ } 

顯而易見的是,由於需要兩個類瀏覽器將不匹配第一div。當然,後者將會匹配。

<div class="minor"> &nbsp; </div> 
<div class="major minor"> &nbsp; </div> 

但這正是想達到的目標;即瀏覽器應該忽略這兩種類型的目標文件的目標爲div,並將樣式應用於第一個類型。

以下不是是可行的,因爲在庫中添加額外的選擇器僅用於在演示頁中使用它們是不合邏輯的。

div.major.minor, div.demo.minor { /* styling statements */ } 

該解決方案甚至可以利用JavaScript,沒有要求只堅持HTML/CSS。任何解決方法都可以。

作爲最後的手段(如果找不到更好的解決方案),我將在演示頁面的額外樣式表中複製我想從庫中獲得的樣式。但是我當然想避免這種情況,因爲涉及到很多重複的代碼。

感謝您的幫助:)

+2

通過javascript將'major'類添加到所有'.minor'只有類元素 – andybeli

+2

這是非常不清楚的。我知道你想將樣式應用到兩個div,但是你可以簡單地從選擇器中移除'.major'來做到這一點。你能否在演示環境外部和內部提供更「真實世界」的例子? – Archer

+0

我可能會使用LESS或SCSS來做你想要的。您可以僅使用一行定位額外的選擇器,而不會導致您擔心的重複。 –

回答

0

既然你正在使用的樣式將是一個庫,你最好不要惹它只是風格你演示頁面。

這是兩件獨立的事情,一個單獨的CSS文件將確保一切按計劃進行。其他任何事情都需要付出更多的努力,而不是真正的價值,這可能會讓事情走下坡路。

相關問題