我在 IE 11（在 Windows 7 上）中遇到问题，指定了边框半径的 DIV 的右侧边缘看起来很模糊。看看这个例子：-
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>Test Page</title>
<style>
body {
background-color: red;
}
.Container {
background-color: black;
margin-left: auto;
margin-right: auto;
padding-left: 25px;
padding-right: 25px;
padding-top: 10px;
min-height: 300px;
width: 600px;
}
.Surround {
background-color: lightgreen;
border-radius: 7px;
float: left;
padding: 6px;
width: 588px;
}
.Inner {
background-color: blue;
border-radius: 7px;
color: white;
float: left;
width: 100%;
}
</style>
</head>
<body>
<div class="Container">
<div class="Surround">
<div class="Inner">
<h2>Test</h2>
</div>
</div>
</div>
</body>
</html>
首先，页面通常看起来不错。但是，调整页面大小以便出现垂直滚动条（通过使页面足够小以进入黑色 DIV 部分）。然后您应该注意到蓝色和绿色框的右侧边缘都变得模糊了。
注意：有时页面一开始是模糊的，当您启用垂直滚动条时，页面会变得清晰，这似乎只是取决于 IE 页面的大小。
如果我摆脱边界半径，它就可以解决问题。如果我去掉 margin-left 和 margin-right auto，使页面左对齐，就可以解决问题。所以它似乎是具有指定边框半径的居中页面的组合。
有人知道如何解决这个问题吗？我假设这是 IE 11 的错误，因为它在 IE 10、IE 9、Chrome、Firefox 中运行良好。
JSFIDDLE：http://jsfiddle.net/UjpSe/ http://jsfiddle.net/UjpSe/
此后，我在 Windows 7 上的第三台 IE 11 计算机上尝试了此操作，仅在其中 2 台计算机上出现问题。所以不确定它是否可能与设置/显卡相关。
上面的 JSFIDDLE 可能会出错，只要窗口大小足够，使 DIV 位于页面中心，并且您可以启用垂直滚动条并调整大小。
编辑：按要求添加图像。我已将页面大小从 600 像素宽调整为 300 像素，以适应 Stack Overflow。第一张图片右边缘模糊...
当页面大小调整为没有滚动条时，完全相同的页面没有正确的模糊边缘......
