带有注入 html 的 IE 中的 CSS 边框半径答案

【问题标题】：CSS border-radius in IE with injected html带有注入 html 的 IE 中的 CSS 边框半径
【发布时间】：2016-08-15 16:27:58
【问题描述】：

我知道从 IE9 开始，边框半径可用于 IE。但是，当我应用 50% 的边框半径时，在 Firefox 中会显示为一个圆圈。在 IE 中，它仅显示为一个小的弯曲边框。有没有办法在 IE 中实现“圆形图像”效果？进入 IE 的开发工具会发现，将border-radius 设置为任何值都不会产生圆形（它的作用就像有一个上限）。

注意：我有

<!DOCTYPE html>

在根 html 页面中，但是这是由 angular 注入的内容，所以我担心其中的某些标题是导致我的问题的原因。注入内容的开头是：

<?xml version="1.0" encoding="UTF-8"?><d‌iv xmlns:atom="w3.org/2005/Atom";  xmlns:dc="purl.org/dc/elements/1.1/"; class="shouts">

更新：最终解决方案是将图像周围的填充切换为边距（并相应地调整图像大小）。由于某种原因，IE 不会同时使用 padding 和border-radius。

【问题讨论】：

你可能处于怪癖模式吗？确保您有!DOCTYPE。 IE9对border-radius的支持非常好。
Border Radius Not WORKING in IE9的可能重复
我确实有在根 html 页面中，但是这是由 angular 注入的内容，所以我担心其中的某些标题是导致我的问题的原因。注入内容的开头是：
w3.org/2005/Atom" xmlns:dc="purl.org/dc/elements/1.1" class="shouts" >
@hungerstar 修复希望对您有所帮助
请不要在您的问题中添加问题，特别是如果他们有答案。如果您有新问题，请提出新问题。

【解决方案1】：

对于完整的圆圈，只需使用：

border-radius: 1000px;

在某些浏览器中，将边框半径设置为百分比是相对于元素的宽度。

【讨论】：

这就是对border-radius 使用百分比的意义所在，使其成为元素宽度/高度的50%、25% 等。
@hungerstar，也许你应该阅读this article。 IE9 是旧浏览器，如上设置半径（以像素为单位）使元素在所有浏览器中看起来都一样。
@skobaljic 这并没有解决问题，它显示与 50% 相同（只有小的圆形边框）
你应用了什么样的dom元素border-radius？在浏览器检查器中，css显示、宽度和高度的计算值是多少？