css在我的JavaScript窗口小部件碰撞目标页面css [英] css in my JavaScript widget colliding with target page css

问题描述

我已经写了一个非常基本的窗口小部件用于投票，用户通过简单地在代码底部添加一个JavaScript代码来安装它非常像Google分析代码。

I've written a pretty basic widget for voting, users install it pretty much like the Google analytics code by simply adding a JavaScript code to the bottom of their code.

一个问题，我注意到，现在在一些使用广泛的CSS规则的页面是，小部件设计有点搞砸了。在我的小部件CSS中，我已经指定了唯一的名称，以便不应该是一个问题。

A problem I have noticed now on some pages that use broad CSS rules is that the widget design gets a bit messed up. In my widget CSS I have specified unique names so that should not be a problem.

但是当目标页使用如下规则：

However when a target page uses rules like:

body {
    font: 16px/26px Helvetica, Helvetica Neue, Arial;
}

它会影响我的部件的外观。

It effects the look of my widget.

任何想法如何解决这个问题？

Any ideas how I can solve this?

编辑：我试过cleanslate - https://github.com/premasagar/cleanslate
，但这会重置目标页面上的css

Edit: I've tried cleanslate - https://github.com/premasagar/cleanslate but this resets the css on the target page as well

推荐答案

使用Iframe或为您的元素使用内联CSS。

Use Iframe or use inline CSS for your elements.

这篇关于css在我的JavaScript窗口小部件碰撞目标页面css的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！