小部件的css屏蔽

我正在创建一个bookmarklet。它将在页面上显示一个小部件。然而，页面上的一些现有css可能会影响我的小部件。如何避免这种情况？我不想使用iframe。

使用局部重置

拿一个小部件（或者自己滚动），通过将小部件的

id

（或者类）放在前面来命名它

例子 HTML 使用局部重置

拿一个小部件（或者自己滚动），通过将小部件的

id

（或者类）放在前面来命名它

例子 HTML

---

利用这个机会！我们的小部件CSS中的重要声明，用于保护您的规则不被覆盖。

请使用！我们的小部件CSS中的重要声明，以保护您的规则不被覆盖。

不确定“对我的小部件的影响”是什么意思。你的意思是“我不希望我页面上的任何其他东西修改/影响正在讨论的小部件”？为什么不想使用iframe？大卫·托马斯：如果我使用iframe，我需要更改我所有的javascript代码。我不想听起来令人讨厌，但这表明（对我来说）你应该从一开始就使用

iframe

。@alex的回答应该足够好。不确定“对我的小部件的影响”是什么意思。你的意思是“我不希望我页面上的任何其他东西修改/影响正在讨论的小部件”？为什么不想使用iframe？大卫·托马斯：如果我使用iframe，我需要更改我所有的javascript代码。我不想听起来令人讨厌，但这表明（对我来说）你应该从一开始就使用

iframe

。@alex的回答应该足够好了。

<div id="my-bookmarklet-panel">...</div>

#my-bookmarklet-panel a,
#my-bookmarklet-panel div,
#my-bookmarklet-panel span {
    /* Reset rules */
}