CSS：如何添加带边框的圆角和没有图像？

Question

是否有类似的东西可以与IE一起使用？没有图像和边框？

http://www.css3.info/preview/rounded-border/

Answer 1

我没试过，但你可以看看这个

Nifty Corners Cube: rounded corners without images - 
URL is http://www.html.it/articoli/niftycube/index.html

或者你可以尝试

JQuery Corners - 
http://www.atblabs.com/jquery.corners.html

使用示例 -

<div style="background-color:#acc; padding:10px" class="rounded">
  Example with different x and y sizes.
</div>
<script>$(document).ready( function(){
  $('.rounded').corners("30px 10px");
});</script>

Works with:

    * iPhone
    * Chrome
    * Firefox
    * Safari 2+
    * Opera 9.0+
    * Internet Explorer 6+
    * and probably more...

Answer 2

使用CSS3，您可以在不使用任何图像的情况下实现此目的。

但许多浏览器都不支持。

Answer 3

尝试Nifty Corners Cube，但它不允许您使用与内部背景颜色不同的边框颜色。你需要找到一个解决方法（漂亮角落内的漂亮角落）。你也可以结账jQueryUI的themeroller。它使用图像，但您可以使用它来设计自己的主题，所有您需要做的就是下载包含脚本，样式和图像的整个包。查看可以创建突出显示/错误的部分。

这是另一个漂亮角落里漂亮的角落立方体的样本。只需查看来源。 Nifty Corners Cube sample

Answer 4

试试这个：

http://www.cssplay.co.uk/boxes/curves.html

此方法不使用图像，也不使用javascript，而是使用CSS的一些额外HTML。

基本上，此方法基于使用项目符号（•）。子弹被赋予所需的颜色并放置在盒子的四个角落中。盒子相对定位，子弹绝对定位。也就是说，它们相对于父框绝对定位。