div+css，导航栏目应用，如下图，写成这种样式?

Xhtml Code:

Css Code:

body { background:#ffd4ef; font:12px Arial, Helvetica, sans-serif;}

#ullist{ height:200px; list-style:none; position:relative; width:202px;}

#ullist li{ display:inline; margin-right:10px;}

#ullist li a{ background:#ffd4ef; border:1px solid #daa7b8; border-bottom:1px solid #ffd4ef; color:#f00; height:12px; line-height:12px; left:20px; padding:3px 5px; position:absolute; text-decoration:none; top:0; z-index:10;}

#ullist li a.ss{ border-bottom:1px solid #daa7b8;}

#ullist li div{ background:#ffd4ef; border:1px solid #daa7b8; height:100px; left:0; position:absolute; top:19px; width:200px; z-index:9;}

jQuery Code:

$('#ullist li div').hide().eq(0).show();

$('#ullist li a').eq(1).css("left","100px").addClass("ss");

$('#ullist li').click(function(){

$('#ullist li div').hide();

$('#ullist li a').addClass("ss");

$(this).find('div').show();

$(this).find('a').removeClass("ss").blur();

});

附效果图一张，如下所示：

这个不难，也就是上面是框下面就-条线。把上面框都设置边框。然后用相对定位把上面框的底线与下面那条线重合。再设置当鼠标放上去的时候。边柜的下框边的颜色设置为白色，与背景色一样就成了。。。