javascript 禁用用户代理样式表
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13084964/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disabling user agent style sheet
提问by sawa
Is it possible to embed some code in Javascript or CSS for a particular webpage to disable (not load) the user agent style sheet that comes with the browser? I know that I can override it by CSS, but that creates lots of overriden specifications, and that seems to highly affect the CPU usage when browsing the page. Especially, I did something like *{margin:0; padding: 0}
, which seems to be expensive for rendering (particularly the *
selector is expensive). So, I do not want to heavily override the user agent style sheet but rather disable that in the first place if possible. Is this possible? If so, how? I am especially using Google Chrome, but would expect a cross browser way if possible.
是否可以在特定网页的 Javascript 或 CSS 中嵌入一些代码以禁用(不加载)浏览器附带的用户代理样式表?我知道我可以通过 CSS 覆盖它,但这会创建许多覆盖的规范,并且在浏览页面时这似乎会极大地影响 CPU 使用率。特别是,我做了类似的事情*{margin:0; padding: 0}
,这对于渲染来说似乎很昂贵(尤其是*
选择器很昂贵)。所以,我不想大量覆盖用户代理样式表,而是尽可能首先禁用它。这可能吗?如果是这样,如何?我特别使用谷歌浏览器,但如果可能的话,我希望采用跨浏览器的方式。
采纳答案by Jukka K. Korpela
I wonder whether there is a way to disable user agent style sheet directly in JavaScript. There does not seem to be any direct way, since document.styleSheets
does not contain the user agent style sheet. On the other hand, Firefox Web Developer Extension has, in the CSS menu, an option for disabling Browser Default Stylesheet.
我想知道是否有一种方法可以直接在 JavaScript 中禁用用户代理样式表。似乎没有任何直接的方法,因为document.styleSheets
不包含用户代理样式表。另一方面,Firefox Web Developer Extension 在 CSS 菜单中有一个用于禁用浏览器默认样式表的选项。
Anyway, there is a markup way, though I'm not sure whether you like its implications. To start with, it does not work on IE 8 and earlier (they'll show just XML markup, not the formatted content). But modern browsers can handle this:
无论如何,有一种标记方式,但我不确定您是否喜欢它的含义。首先,它不适用于 IE 8 及更早版本(它们只会显示 XML 标记,而不是格式化的内容)。但是现代浏览器可以处理这个:
- Use XHTML markup but do not include the
xmlns
attribute in thehtml
tag. - Serve the document as application/xml.
- For elements that should be handled with their HTML semantics (e.g.,
input
creates an input box), use thexmlns="http://www.w3.org/1999/xhtml"
attribute on the element or an enclosing element.
- 使用 XHTML 标记但不要
xmlns
在html
标签中包含该属性。 - 将文档作为 application/xml 提供。
- 对于应该用它们的 HTML 语义处理的元素(例如,
input
创建一个输入框),使用xmlns="http://www.w3.org/1999/xhtml"
元素或封闭元素上的属性。
This means that outside the effect of xmlns
attributes, all markup is taken as constituting pure, meaning-free, formatting-free (all elements are inline) elements. They can be styled in your stylesheet, though.
这意味着在xmlns
属性的影响之外,所有标记都被视为构成纯粹的、无意义的、无格式的(所有元素都是内联的)元素。不过,它们可以在您的样式表中设置样式。
But this way, you cannot both keep the HTML cake and eat it. That is, you cannot get HTML functionality (for form fields, links, etc.) without having user agent stylesheet being applied to them.
但是这样一来,您就不能既保留 HTML 蛋糕又吃掉它。也就是说,如果没有将用户代理样式表应用于它们,您将无法获得 HTML 功能(用于表单字段、链接等)。
回答by daniel
Use a "reset stylesheet" - this one is good: http://html5boilerplate.com/
使用“重置样式表” - 这个很好:http: //html5boilerplate.com/
回答by Eru
It's not possible. Just create a css file called by most of the people 'reset.css' which includes all the css code used to override user agent's styles
这是不可能的。只需创建一个由大多数人调用的 css 文件“reset.css”,其中包含用于覆盖用户代理样式的所有 css 代码
回答by alphanyx
You can use something like reset css (http://www.cssreset.com/) to reset all browser styles..
您可以使用诸如 reset css (http://www.cssreset.com/) 之类的东西来重置所有浏览器样式..
or, what i prefer, use normalize css (http://necolas.github.com/normalize.css/) that normalizes the css without resetting all styles like list styles on ul, li etc. (reset.css would do that)
或者,我更喜欢使用 normalize css (http://necolas.github.com/normalize.css/) 来规范化 css,而无需重置所有样式,例如 ul、li 等上的列表样式(reset.css 会这样做)