不要使用CSS, jQuery已经被提到过好几次了。如果你需要完全控制你的元素的背景和边界，可以试试jquery背景画布插件。它在背景中放置了一个HTML5 Canvas元素，并允许你绘制你想要的每个背景或边界。圆角，渐变等等。

当然，如果它是一个固定的宽度，它是超级容易使用CSS，而不是在所有冒犯或费力。当你需要向两个方向扩展时，情况就会变得不稳定。有些解决方案将大量的divs堆叠在一起以实现这一目标。

我的解决方案是告诉设计师，如果他们想使用圆角(暂时)，它需要一个固定的宽度。设计师喜欢圆角(我也是)，所以我觉得这是一个合理的妥协。

Ruzee Borders是我发现的唯一一个基于javascript的反锯齿圆角解决方案，适用于所有主流浏览器(Firefox 2/3, Chrome, Safari 3, IE6/7/8)，也是唯一一个在圆角元素和父元素都包含背景图像时工作的解决方案。它还可以处理边界、阴影和发光。

更新的RUZEE。ShadedBorder是另一个选项，但是它缺乏从CSS中获取样式信息的支持。

没有“最好”的方法;有适合你的方法也有不适合你的方法。话虽如此，我在这里发布了一篇关于创建CSS+图像的流畅圆角技术的文章:

使用CSS和图像的圆角盒子-第2部分

这个技巧的概述是使用嵌套的div和背景图像重复和定位。对于固定宽度的布局(固定宽度可拉伸的高度)，你需要三个div和三张图片。对于流体宽度布局(可拉伸宽度和高度)，您需要9个div和9张图像。有些人可能会认为这太复杂了，但恕我直言，这是有史以来最简洁的解决方案。没有黑客，没有JavaScript。

不久前我写了一篇关于这方面的博客文章，想要了解更多信息，请看这里

<div class="item_with_border">
    <div class="border_top_left"></div>
    <div class="border_top_right"></div>
    <div class="border_bottom_left"></div>
    <div class="border_bottom_right"></div>
    This is the text that is displayed
</div>

<style>
    div.item_with_border
    {
        border: 1px solid #FFF;
        postion: relative;
    }
    div.item_with_border > div.border_top_left
    {
        background-image: url(topleft.png);
        position: absolute;
        top: -1px;
        left: -1px;     
        width: 30px;
        height: 30px;
        z-index: 2;
    }
    div.item_with_border > div.border_top_right
    {
        background-image: url(topright.png);
        position: absolute;
        top: -1px;
        right: -1px;        
        width: 30px;
        height: 30px;
        z-index: 2;
    }
    div.item_with_border > div.border_bottom_left
    {
        background-image: url(bottomleft.png);
        position: absolute;
        bottom: -1px;
        left: -1px;     
        width: 30px;
        height: 30px;
        z-index: 2;
    }
    div.item_with_border > div.border_bottom_right
    {
        background-image: url(bottomright.png);
        position: absolute;
        bottom: -1px;
        right: -1px;        
        width: 30px;
        height: 30px;
        z-index: 2;
    }   
</style>

它运行得很好。不需要Javascript，只需CSS和HTML。用最小的HTML干扰其他东西。它与Mono发布的非常相似，但不包含任何ie6的特定hack，经过检查，似乎根本不起作用。另外，另一个技巧是使每个角落图像的内部部分透明，这样它就不会挡住角落附近的文本。外部部分不能是透明的，这样可以掩盖非圆角div的边框。

此外，一旦CSS3广泛支持border-radius，这将是官方制作圆角的最佳方法。

Opera目前还不支持border-radius(显然在版本10之后才会支持)。同时，您可以使用CSS设置SVG背景来创建类似的效果。