圓角矩形的html+css實(shí)現(xiàn)代碼

    閑來(lái)無(wú)事，突然又想起了圓角矩形的實(shí)現(xiàn)。不過(guò)這個(gè)話題大家已經(jīng)談了太長(zhǎng)時(shí)間了。各種各樣的實(shí)現(xiàn)方案在網(wǎng)上都可以看到。這里僅僅是記錄一下個(gè)人認(rèn)為比較好的一個(gè)。這個(gè)方案不使用任何圖片，是純html+css實(shí)現(xiàn)。
    css代碼
    代碼如下:
    <style type="text/css">
    .spiffy{display:block}
    .spiffy *{
    display:block;
    height:1px;
    font-size:.01em;
    overflow:hidden;
    background:#b20000}
    .spiffy1{
    margin-left:3px;
    margin-right:3px;
    padding-left:1px;
    padding-right:1px;
    border-left:1px solid #870000;
    border-right:1px solid #870000;
    background:#9f0000}
    .spiffy2{
    margin-left:1px;
    margin-right:1px;
    padding-right:1px;
    padding-left:1px;
    border-left:1px solid #6f0000;
    border-right:1px solid #6f0000;
    background:#a30000}
    .spiffy3{
    margin-left:1px;
    margin-right:1px;
    border-left:1px solid #a30000;
    border-right:1px solid #a30000;}
    .spiffy4{
    border-left:1px solid #870000;
    border-right:1px solid #870000}
    .spiffy5{
    border-left:1px solid #9f0000;
    border-right:1px solid #9f0000}
    .spiffyfg{
    background:#b20000}
    </style>
    html代碼
    代碼如下:
    <div>
    <b>
    <b><b></b></b>
    <b><b></b></b>
    <b></b>
    <b></b>
    <b></b>
    </b>
    <div>
    &bull;&bull;&bull;
    </div>
    <b>
    <b></b>
    <b></b>
    <b></b>
    <b><b></b></b>
    <b><b></b></b>
    </b>
    </div>
    有興趣就試一下上面兩段代碼吧。