在一個元素中忽略文檔樣式規則

我寫了一個添加sticky notes到網站的greasemonkey腳本。因爲在某些網站中有時會使用非常奇怪的樣式規則，所以粘滯便箋有時會變得混亂（或者至少看起來並不像我希望它們看起來那樣）。在一個元素中忽略文檔樣式規則

有沒有辦法說「在這個元素下不應用任何泛型樣式」？因此與標籤名稱相關的規則不適用，但與某些類和id相關的規則仍然存在。或者，有沒有人對如何確保只有我的風格適用於粘滯便箋有更好的想法？

來源

2010-05-08 panzi

AFAIK，這是不可能的。

相反，您必須確保您手動定義每種樣式。不要依賴違約。如果你按照我選擇你的元素，他們會得到高度重視。

來源

2010-05-08 20:22:00 Ikke

那麼，我需要從頭開始重新實現所有的HTML元素，因爲有些頁面甚至像列表項那樣重新定義了基本樣式。 – panzi 2010-05-08 20:50:23

是的，你也會有。這是您確定元素的樣式的唯一方式。 Iirc，燈箱等組件也使用相同的策略。 – Ikke 2010-05-08 20:56:15

您是否嘗試過「！important」關鍵字？

它重寫CSS繼承層次結構。

來源

2010-05-08 20:26:36 Michele

這隻能應用於我明確使用的樣式。我希望重置默認值，所以我不必手動重新定義它們。例如。在google.com甚至列表項目是風格（沒有子彈，沒有縮進）。而在stackoverflow列表項目似乎居中。基本上我需要重新創建所有的HTML元素。 – panzi 2010-05-08 20:49:10

非常感謝！真的很有幫助！ – 2012-10-24 01:39:42

@Michele你好。我怎樣才能讓重要的風格元素內部？這是可能的還是僅在外部CSS規則？ – 2014-03-30 09:26:06

這聽起來像是一個簡單的css特異性問題，是不是？看起來你應該讓你的css規則更具體，更具彈性（不要在現有規則上傳遞，希望改變默認值並編寫你需要的規則）。

這裏有一些鏈接到CSS的特異性念起來：

來源

2010-05-09 11:34:04 erikvold

這的確是一個專一的問題。我想象你在一個單一的div#stickyContainer元素中有粘滯便箋，在這種情況下，您應該通過它們屬於該元素的事實來覆蓋CSS屬性，並確保您重置的所有內容。

也就是說，內div#stickContainer div.sticky { ... }確保您設置每 CSS屬性，你想什麼它是，即使你只是將它們設置爲一個典型的瀏覽器默認設置，包括!important關鍵字後面每個指令。

來源

2010-05-09 11:46:38 icio

將您想要免除頁面CSS規則的代碼放在單獨的文檔中，並使用<iframe src='[location]' />。這是我們爲博客文章中的HTML示例所做的。

來源

2013-10-15 20:59:43 pauljm

這是沒有服務器組件的所有JavaScript。我想我可以嘗試創建一個空白的iframe並開始處理它的內容。或者僅適用於Firefox（無論如何都是腳本），我可以將所有內容都編碼爲一個巨大的'data：'-URL。（並非所有的瀏覽器都支持巨大的數據：'-URL。） – panzi 2013-10-15 21:24:35

在一個元素中忽略文檔樣式規則

回答

相關問題