#tabs ul{ list-style:none; margin:0; padding:0; } #tabs ul li{ 100px; height:20px; display:inline-block; *display:inline; zoom:1; border:solid 1px blue; border-left-0; position:relative; } #tabs ul li a { display: inline-block; 100px; text-align: center; text-decoration: none; height:20px; } #tabs ul li a:hover { border-bottom:solid 1px #fff; _position:absolute; /*background-color:#6a5acd;*/ } #tabs ul .first-li{ border-left-1px; } #content{ 403px; height:70px; border:solid 1px blue; border-top-0; }
<div id="tabs"> <ul><li class="first-li"><a href="#">tab1</a></li><li><a href="#">tab2</a></li><li><a href="#">tab3</a></li><li><a href="#">tab4</a></li></ul> <div id="content"></div> </div>
ul和li之间没有空行,否则tab之间会有几像素的间距