执行下边这段jquery代码，为什么点击"显示div的尺寸"按钮后，div的宽度和高度要多出0.04px
执行下面这段jquery代码，为什么点击"显示div的尺寸"按钮后，div的宽度和高度要多出0.04px？
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(function(){
$("button").click(function(){
var txt="";
txt+="Width of div: " + $("#div1").width() + "</br>";
txt+="Height of div: " + $("#div1").height();
$("#div1").html(txt);
});
});
</script>
</head>
<body>
<div id="div1" style="height:100px;width:300px;padding:10px;margin:5px;border:1px solid blue;background-color:lightblue;"></div>
<br>
<button>显示div的尺寸</button>
<p>width() - 返回元素的宽度。</p>
<p>height() - 返回元素的高度。</p>
</body>
</html>
---------------------
上面的代码中，点击"显示div的尺寸"按钮后，结果是：
Width of div: 300.04
Height of div: 100.04
而div的style里面却是height:100px;width:300px;为什么要多出0.04?
------解决方案--------------------
这个是什么浏览器搞得，测试了几个浏览器，加上IE的兼容模式，都没有发现你说的问题。
<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<script>
$(function(){
$("button").click(function(){
var txt="";
txt+="Width of div: " + $("#div1").width() + "</br>";
txt+="Height of div: " + $("#div1").height();
$("#div1").html(txt);
});
});
</script>
</head>
<body>
<div id="div1" style="height:100px;width:300px;padding:10px;margin:5px;border:1px solid blue;background-color:lightblue;"></div>
<br>
<button>显示div的尺寸</button>
<p>width() - 返回元素的宽度。</p>
<p>height() - 返回元素的高度。</p>
</body>
</html>
---------------------
上面的代码中，点击"显示div的尺寸"按钮后，结果是：
Width of div: 300.04
Height of div: 100.04
而div的style里面却是height:100px;width:300px;为什么要多出0.04?
------解决方案--------------------
这个是什么浏览器搞得，测试了几个浏览器，加上IE的兼容模式，都没有发现你说的问题。