Tabs切换CSS

#tabs > ul{
display:block;
border:1px #d5d5d5 solid;
background:#ddd;
height:35px;
padding-top:5px;
padding-left:10px;
}
#tabs > ul li{
float:left;
padding:10px 15px;
color:#666;
background:#ddd;
cursor:pointer;
}
#tabs > ul li.active{
color:#333;
background:#fff;
border-radius:3px 3px 0 0;
position:absolute;
}
#tabs > div{
display:none;
border:1px #d5d5d5 solid;
border-top:none;border-radius:0 0 5px 5px;
}
#tabs > div.active{display:block;}
.clearfix{
*zoom: 1;
clear: both;
}
.clearfix:before,
.clearfix:after {
display: table;
line-height: 0;
content: "";
clear: both;

}

.checkbox,.radio{vertical-align:middle; margin-top:-2px;}

<div id="tabs">
    <ul class="clearfix">
        <li class="active">基本信息</li>
        <li>图片上传</li>
        <li>详细信息</li>
    </ul>
    <div title="基本信息" style="padding:10px 0; ">
        
    </div>
    <div title="图片上传" style="padding:10px 0; ">
        
    </div>
    <div title="详细信息" style="padding:10px 0; ">
        
    </div>
</div>