html - 具有边界半径但没有边界的 DIV

Question

我有一个带有border-width: 0px;和border-radius: 5px;（或-moz-border-radius等）的 div。

在 Chrome、Safari 和 Firefox 中，这工作得很好，div 得到圆角，所以它在角落里是透明的。

但是，IE9 不显示圆角（我检查过，IE 确实处于“IE9 模式”，我有一个 HTML5 文档类型并设置X-UA-Compatible为IE=edge）。只有当我添加

border-style: solid;
border-width: 1px;

我可以让 IE9 在不声明实际边框的情况下呈现圆角吗？

Answer 1

问题是 div 填充了渐变。由于 IE9 不支持 CSS 渐变，我不得不使用

filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#79D5FF', endColorstr='#08609A');

这不适用于圆角，即border-radius不会切断渐变的角落。

Answer 2

border-top-left-radius例如，您是否尝试过使用border-top-right-radius等？我以前在 div 的圆角上使用过类似的东西，它在 IE9/Chrome/FF 中工作，但不是 IE8。