很多时候在做样式时会选择使用圆角样式，圆角样式不仅可以看起来圆滑，而且和周边的元素交接得很好，不会觉得太过生硬。但是众所周知，现在的IE版本不支持圆角样式，真是让人又爱又恨。实现圆角方式有很多，可以表格+图片，可以div+图片，也有只使用CSS样式要做的，但是这种方法会让代码变得冗长、增加了一部分无意义的代码，但是对于追求纯样式的来说，不失为一个好办法，这种办法实现的圆角兼容性也不错。
【样式代码】

       body,h1{margin:0; padding:0;}
       body{ width:100%; font-size:12px;}
       .msgBox
       {
           width:500px;margin:100px auto 0;
       }
       .msgTitle{ height:48px; color:#BF2803; font-size:24px; line-height:48px;
                  background:url('images/error_big.png') no-repeat 0 center;
                  padding-left:60px; font-family:微软雅黑,黑体; margin-left:60px;
                }
       .msgContent{ margin-left:120px; border-left:5px solid #BF2803; padding-left:12px;}
       .msgContainer{width:498px;background-color:#F3D8D8; padding:10px 0;border-width:0 1px;border-color:#C00; border-style:solid;}
       .rnd1,.rnd2,.rnd3{ overflow:hidden; height:1px; line-height:1px; font-size:1px; border-color:#C00; border-style:solid; display:block;background-color:#F3D8D8;}
       .rnd1{ border:none; margin:0 4px;background-color:#C00; height:0px;/*为了圆滑，不再使用border改为背景色*/}
       .rnd2{ border-width:0 2px; margin:0 2px;}
       .rnd3{ border-width:0 1px; margin:0 1px;}
       .border-top,.border-btm{border-color:#C00; border-style:solid;}
       .border-top{ border-width:1px 1px 0;}
       .border-btm{ border-width:0 1px 1px;}

【HTML结构代码】

        
        
            
            
            
        
        

对不起，您没有足够的权限！

                请尝试重新登录或联系管理员解决
            


        
        
            
            
            
        
    

【效果图】
测试之后，效果兼容IE6+及其他常用浏览器。