user-agent – 什么原因导致“用户代理样式表”使用“border-box”而不是“content-box”进行大小调整?

前端之家收集整理的这篇文章主要介绍了user-agent – 什么原因导致“用户代理样式表”使用“border-box”而不是“content-box”进行大小调整?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我的印象是,浏览器(如Safari,Chrome和Firefox)中的用户代理样式表是浏览器内部的,不能直接修改(而是需要覆盖样式属性)。

由于Mozilla的各种网站,Webkit和Mozilla的Box-sizing属性的默认值是“content-Box”,所以我也受到印象。

我在一个相当简单的虚拟页面上测试了这个在各种浏览器中查看。

我的问题是,在我们的生产应用程序的两个页面上,默认属性是不同的,我们不知道为什么这是。

一页我们在Web Inspector或控制台中看到“边框”框的大小调整属性。它分配给CSS选择器输入:not([type =“image”]),textarea。

在另一页上,Web Inspector或控制台中没有提到Box-sizing属性

有没有人知道是否有某种方式直接影响特定页面用户代理样式表中的框大小定义?也许有一个图书馆这样做?我们在应用程序中使用prototype.js和swfobject.js …

更新:如果我的Web应用程序几乎每一个页面都不清楚,并且我在Box-sizing属性中测试的每个“虚拟”页面都有默认的“content-Box”值。由于某种原因,我的Web应用程序中的一个特定页面在Web检查器中显示用户代理样式表(浏览器为其默认使用的样式表)将该属性设置为“border-Box”。我不能为了我的生活找出为什么这是。我正在寻找可能导致Firefox更改其属性的默认值的任何内容

解决方法

刚刚有同样的问题。在我的情况下发生的是有人把一个Javascript代码片段放在<!doctype html>之上。因此,当我通过firebug检查DOM时,似乎该文档没有doctype。

当我删除了JS代码段,使得doctype声明位于该文件的最顶端时,该doctype重新出现并修复了我看到的框大小问题(与之相同)。
看到:

希望这可以帮助。

猜你在找的CSS相关文章