jQuery导致Firefox框大小警告

前端之家收集整理的这篇文章主要介绍了jQuery导致Firefox框大小警告前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有WebDeveloper扩展,我收到一个CSS警告,所以我去调查它。警告是以下3项:
Warning: Unknown property 'Box-sizing'.  Declaration dropped.
Line: 0

然后我做了一个空白的文件,注意到它不在那里。几分钟后,我发现一个可重复的原因:包括jQuery 1.9.1脚本!

我能做甚么应该做什么?我想使用jquery,但我觉得有点恼人,我会永远看到我的工具栏中的CSS警告。

<!DOCTYPE html>
<html>
<head></head>
<body>
<div>Empty</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
</body>
</html>

解决方法

选项

>使用jQuery 1.7.2。
>提出与jQuery团队的问题,希望修复(或自己提供一个)。
>使用Firebug代替WebDeveloper(可能或可能不帮助)。
>忽略它。

只要页面正确呈现,我相信这是一个警告,您可以安全地忽略,即使您正在构建严格要求验证CSS的网站。

一旦Firefox完全支持盒子大小(不需要-moz-前缀),那么警告就应该消失,但直到Firefox 21之后的版本才会发生。

背景资料

警告来自某些CSS样式所需的不同语法。为了支持所有的浏览器,你通常必须指定所有的各种语法。浏览器会忽略他们不认识的。

在盒子大小的情况下,Firefox需要-moz-前缀,Safari Mobile的早期版本,Android浏览器需要-webkit前缀,而其他浏览器根本不需要前缀:

-webkit-Box-sizing: content-Box;
   -moz-Box-sizing: content-Box;
        Box-sizing: content-Box;

添加线性渐变时,出现类似的问题,在这种情况下由值而不是属性名称引起:

background-image: -webkit-linear-gradient(top,#444,#999);
background-image:    -moz-linear-gradient(top,#999);
background-image:     -ms-linear-gradient(top,#999);
background-image:      -o-linear-gradient(top,#999);
background-image:         linear-gradient(top,#999);

当使用不同的语法出现警告时,通常情况下,验证器或错误控制台不够聪明,无法识别通常不可避免的无害的问题。而且公平地说,这实际上是一个警告,而不是一个错误

附加信息

较新版本的jQuery使用了盒子大小的样式,用于内部用途。 jQuery 1.8.0只生成一个框大小的警告,而jQuery 1.7.2不产生。

jQuery可能会以稍微粗心的方式使用它 – 没有首先测试是否有某种类型的支持,但不会造成任何实际的伤害。如果是这样,如果有足够的人向jQuery团队投诉,那么jQuery代码可能会被重构,以解决这个问题(以jQuery的运行速度慢一些)。

如果警告是关于-moz-Box-sizing而不是框大小,那么更有可能的是建议Firefox可能出现的错误,而不是jQuery的一个小问题。

猜你在找的jQuery相关文章