2010-10-19 144 views
2

我正在開發Google Chrome擴展程序。如何擺脫父網頁樣式

擴展在任何網頁裏面顯示一個對話框(jquery ui,作爲div),在對話框中用戶可以添加一些內容[HTML body without body,without styles info]。

我面臨的問題是,在網頁中指定的樣式正在被應用到jQuery對話框和內容用戶正在添加。

例如,當我啓動我的插件在stackoverflow網頁上,所有的文本成爲中心對齊等等等

什麼是最好的方式擺脫div內的父母樣式?

回答

0

我已經完成了使用IFRAME,它基本上創建了一個框中的全新的HTML文檔,沒有「父」頁面的樣式。另一種選擇是重新定義div中的所有樣式,但這非常單調乏味。

+0

謝謝,我會試一試:) – Hoshin 2010-10-21 08:22:22

1

你應該看看重置樣式表幾乎每個CSS框架都附帶了。你可以採取復位樣式表和所有的重置樣式應用到您的特定DIV:

div.YourDiv, div.YourDiv * { 
    margin:0; 
    padding:0; 
    border:0; 
    ... 
} 

應復位兩個YourDiv及以下的所有元素。之後,您可以根據需要啓動w /造型子元素。

+0

它不會重置父頁面上的所有樣式嗎? – serg 2010-10-19 05:06:29

+0

不,因爲上面的樣式只會重置特定div YourDiv和所有這個div的後代元素。除非在該頁面上有一個具有YourDiv類的div,否則應該全部設置。 – 2010-10-19 05:07:44

+0

我明白了,好主意。 – serg 2010-10-19 05:13:48