IE：边框半径与背景不平滑

Question

我在IE环境中遇到样式问题。 当我使用border-radius制作div圆时，圆形div的边框不如chrome或firefox所示平滑。

以下是我使用的代码

html

<div class="col-sm-4">
    <div class="circle-images"></div>
</div>

的CSS

顶部填充：放置背景图片时，有60％的像素使div方形。

.circle-images{
   width:60%;
   padding-top:60%;
   border-radius: 60%;  
   margin-right: auto;
   margin-left: auto;
   background: url("some/path/to/jpg") no-repeat center center;
   background-size:contain;
 }

我也尝试过这种风格。 边界比没有边界时更平滑一些，但是边界上有很多噪音。

.circle-images{
  width: 60%;
  padding-top:50%;
  border-radius: 60%;
  border: 27px solid #EAEAE4;
  margin-right:auto;
  margin-left:auto;
  background: url("some/path/to/jpg") no-repeat center center;
  background-size:contain;
}

有什么方法可以像IE中的Chrome一样使边框更平滑？

**更新**由于@LGSon正在询问示例图像，所以这是正在发生的事情

IE噪音

Answer 1

这是IE中的错误。 最安全的方法（但不是最简单的方法）是使图像自己变成圆形。 另一个解决方案是尝试使用特定于浏览器的黑客，但这是非常不安全的。

如果有可能，我建议您转换为允许透明的PNG之类的图像结构，然后使图像变为圆形。