Html
    Css
    Js

    
                        
#sidebar-tab {
	border:1px solid #ccf;
	margin-bottom:1.5em;
	overflow:hidden;
	width:235px
}
#tab-title h3 {
	color:#666;
	font-size:15px;
	font-weight:400;
}
#tab-title .selected {
	color:#356aa0;
	border-bottom:0px;
}
/*标题被选中时的样式*/ 
#tab-title span {
	padding:5px 9px 5px 10px;
	border:1px solid #ccf;
	border-right:0px;
	margin-left:-1px;
	cursor:pointer;
}
#tab-content .hide {
	display:none;
}
/*默认让第一块内容显示,其余隐藏*/ 
#tab-content ul {
	padding:5px 10px;
	overflow:hidden;
}
#tab-content ul li {
	padding-top:5px;
	height:20px;
}

                        
↑上面代码改变,会自动显示代码结果 jQuery调用版本:1.7.2
 立即下载

jquery的tab栏

简单粗暴,复制可用

0