方法1：div嵌套实现多重边框。
效果图：
html代码
XML/HTML Code复制内容到剪贴板
<div id="outer">
<div id="inner">div嵌套实现多重边框</div>
</div>
css代码
CSS Code复制内容到剪贴板
#outer {
width: 100px;
height: 100px;
background-color: bisque;
border: 10px solid brown;
position: relative;
}
#inner {
width: 84px;
height: 84px;
border: 8px solid blue;
}
/*#outer,
#inner {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}*/
缺点：可能无法修改结构或修改html结构成本高；多个div都设置圆角时，边框之间不能完全贴合。圆角多边框效果图：
方法2：使用outline+outline-offset实现多重边框。
如果我们只需要绘制两层边框，使用outline也可以做到。outline是border外面的一层，和border原理一样。通过设定outline的样式可以为border外面再设定一层边框。
但是需要注意的是，outline属性设定的边框不会随着内部元素边界样式的变化而变化。也就是说，如果元素边框带了圆角，那么outline绘制出的最外层边框仍然是矩形的。这是outline绘制边框的一个缺憾。
效果图：
html代码
XML/HTML Code复制内容到剪贴板
<div id="outline">outlie实现多重边框</div>
css代码
CSS Code复制内容到剪贴板
#outline {
width: 84px;
height: 84px;
border: 8px solid blue;
/*-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;*/
outline: 10px solid brown;
