double border双线框效果

双线框(border-style方式)：border-style:double

现代浏览器均支持：

.double-border{
    border:3px double #000;
}

双线框（border-colors方式）：border-colors/-moz-border-colors

以下的不同双线框实现仅Firefox支持，其它浏览器暂不支持（不含渐变色的实现）

.double-border2{
    border-width:3px;
    border-style:solid;
    /* For Firefox3.6+ */
    -moz-border-top-colors:#000 #fff #000;
    -moz-border-right-colors:#000 #fff #000;
    -moz-border-bottom-colors:#000 #fff #000;
    -moz-border-left-colors:#000 #fff #000;
}

border-colors方式双线框的一些常规效果：

Figure 2：

double border

Figure 3：

double border

Figure 4：

double border

Figure 5：

double border

Figure 6：

double border

Figure 7：

double border

多边框：

利用 box-shadow 实现

Eh careful man, there's a beverage here eh!

double border双线框效果

双线框(border-style方式)：border-style:double

现代浏览器均支持：

双线框（border-colors方式）：border-colors/-moz-border-colors

border-colors方式双线框的一些常规效果：

Figure 2：

Figure 3：

Figure 4：

Figure 5：

Figure 6：

Figure 7：

多边框：

问题及注意事项：