CSS2.0的圆角制作

来源：互联网发布：淘宝买微信号怎么搜编辑：程序博客网时间：2024/06/06 03:39

个人主页：http://laichuanfeng.com/

CSS部分

         .item {            width: 100px;            margin: 0 auto;            padding: 0;            font: bold 12px arial;        }            .item p {                padding: 0 0 2px 0;                margin: 0px;                text-align: center;                background: #cc6;                border: solid 1px #000;                border-top-width: 0px;            }            .item div {                height: 1px;                overflow: hidden;                background: #cc6;                border-left: solid 1px #000;                border-right: solid 1px #000;            }            .item .row1 {                margin: 0 4px;                background: #000;            }            .item .row2 {                margin: 0 3px;            }            .item .row3 {                margin: 0 2px;            }            .item .row4 {                margin: 0 1px;                height:2px;            }

HTML部分

    <div class="item">        <div class="row1"></div>        <div class="row2"></div>        <div class="row3"></div>        <div class="row4"></div>        <p>Radius</p>    </div>

最终效果

0 0