* { margin:0; padding:0; } body { font-family:"Microsoft YaHei"; } li { list-style:none; } .clearfix:before,.clearfix:after { content:""; display:table; } .clearfix:after { clear:both; } .clearfix { clear:both; *zoom:1; } .show { display:block!important; } .box { width:400px; margin:20px auto; border:1px solid #dcdcdc; } .ul_list { width:100%; height:35px; border-bottom:1px solid #dcdcdc; } .ul_list li { float:left; width:25%; line-height:35px; text-align:center; border-left:1px solid #dcdcdc; box-sizing:border-box; cursor:pointer; } .ul_list li.active { background:#00a1ea; color:#fff; } .div_box { padding:20px; } .div_box .div_list { display:none; } .div_box .div_list ul li { line-height:30px; font-size:14px; cursor:pointer; } .div_box .div_list ul li:hover { color:#00a1ea; }