用css实现圆角

原创 于 2006-09-27 16:00:00 发布 · 756 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#css #class #div #html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>圆角示例</title>
<style type="text/css">
<!--
.headerRCBox { }
.headerRCBox .rch { display: block; }
.headerRCBox .rch * {
    display: block;
    height: 1px;
    overflow: hidden;
    background: #CCC;
    }
.headerRCBox .rch1 {
    border-right: 1px solid #E9E9E9;
    padding-right: 1px;
    margin-right: 3px;
    border-left: 1px solid #E9E9E9;
    padding-left: 1px;
    margin-left: 3px;
    background: #D9D9D9; /* rch5 */
    }
.headerRCBox .rch2 {
    border-right: 1px solid #FAFAFA;
    border-left: 1px solid #FAFAFA;
    padding: 0px 1px;
    background: #D6D6D6; /* rch3 */
    margin: 0px 1px;
    }
.headerRCBox .rch3 {
    border-right: 1px solid #D6D6D6;
    border-left: 1px solid #D6D6D6;
    margin: 0px 1px;
    }
.headerRCBox .rch4 {
    border-right: 1px solid #E9E9E9;
    border-left: 1px solid #E9E9E9;
    }
.headerRCBox .rch5 {
    border-right: 1px solid #D9D9D9;
    border-left: 1px solid #D9D9D9;
    }
.headerRCBox .content {
    background: #CCC;
    padding: 0px 6px 2px 6px;
    }-->
</style>
</head>

<body>

<div class="headerRCBox">

    <b class="rch">
    <b class="rch1"><b></b></b>
    <b class="rch2"><b></b></b>
    <b class="rch3"></b>
    <b class="rch4"></b>
    <b class="rch5"></b>
    </b> 
    <div class="content">        
        <div class="headerTitleRight">    
            <div class="label" style="margin-right: 5px;">
                Groups 1 - 10 of 39
            </div>
        </div>
        <div class="headerTitle">Featured Groups</div>
    </div>
    
</div>
    
</body>
</html>
 
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值