有没有一种方法来检测浏览器是否有亚像素精度的？(Is there a way to detect i

有没有一种方法来检测浏览器是否有元素亚像素精度的？

IE9，不同于任何其他的主流浏览器，有它的元素亚像素精度的（一个元素宽度可以50.25px），正因为如此，我需要区别对待的事情。

一种方法是使用jQuery来检测浏览器名称和版本，但是这是在jQuery的废弃，不推荐，而不是建议的特征的存在应该不浏览器的名称和版本进行测试。

Answer 1:

我不知道你在哪里得到的想法，IE9是支持分数像素单位唯一的浏览器，但这种假设是完全不正确的。

从该规范的第4.3节（强调）：

的长度值的格式（用<长度>在本说明书中表示）是一个<编号>（具有或不具有小数点）紧接着一个单元标识符（例如，像素，EM，等）。

并限定<编号>：

一些值类型可以具有整数值（表示为<整数>）或实数的值（由<编号>表示）。实数和整数只在十进制形式指定。一个<整数>由一个或多个数字“0”至“9”。 A <编号>可以是一个<整数>，或者它可以是零个或多个数字后跟一个句点（。），随后一个或多个数字。 “ - ”整数和实数可以由前面或“+”来表示符号。 -0是相当于0并且不是负数。

因此，按规格，所述px长度单位必须支持小数。

为了证明这一点，看看这个小提琴在全屏和使用浏览器的缩放功能放大所有的方式：

在这个浏览器的截图，请注意5.5px蓝盒子确实比5px的红框高。

我觉得混乱可能来自非标准的事实干element.clientHeight返回计算（取整）的整数值，并四舍五入发生浏览器而不同。

在我的小提琴，对clientHeight蓝色的<div> ，IE9和100％缩放火狐15给6 。 Chrome浏览器22和Opera 12给予5 。在所有的浏览器，那属性更改用户的价值改变浏览器的缩放级别。

换句话说，它是不可靠的。

如果你想要做一个元素的实际，辅币单位计算，使用getComputedStyle 。

var el = $('#b')[0]; // the actual DOM element
var height = parseFloat(getComputedStyle(el).height); // => 5.5

Answer 2:

你可以创建一个奇怪的大小容器，并在它下降2个50％的宽度的元素，并找出他们是否已经拆分50:50与否。

见http://jsfiddle.net/alnitak/jzrQ6/

它返回false在Chrome 22.0.1229.79在MacOS X 10.8.2，和true在Firefox 15.0.1。我没有MSIE来测试它。

Answer 3:

http://jsfiddle.net/KAW3d/1/

在IE6，IE7和Opera 12.02：100.5px + 100.5px = 200像素（2个100.5px浮子装配到200像素容器）
在IE8 +，火狐15.0.1，铬22：100.5px + 100.5px> 200像素

Answer 4:

我们不得不最近做了一些严重的像素完美的计算，我需要检查浏览器是否打算支持子像素布局。我创建了使用中的测试Conditionizr或Modernizr的使用一些其他的答案作为指南：

conditionizr.add('subpixel-layout', function() {
    var $testWrap = $(
        '<div style="width: 4px; height: 2px; position: absolute; right: 0; bottom: 0;">' +
            '<div id="subpixel-layout-1" style="width: 2.5px; height: 1px; float: left;"></div>' +
            '<div id="subpixel-layout-2" style="width: 2.5px; height: 1px; float: left;"></div>' +
        '</div>'
    ).appendTo('body');

    var supported = $('#subpixel-layout-1').position().top !== $('#subpixel-layout-2').position().top;
    $testWrap.remove();
    return supported;
});

然后，你可以使用：

conditionizr.on('!subpixel-layout', function () {
    // subpixel layout is NOT available
});

你应该能够做同样的事情在Modernizr的与Modernizr.addTest()但我没有测试它。

很显然，我使用jQuery在这里，但应该是没有它相当简单为好。

文章来源: Is there a way to detect if the browser has subpixel precision?