* {
padding:0;
margin:0;
box-sizing:border-box
}
div {
width:70%;
margin:20px auto;
}
ul {
list-style:none;
overflow:hidden;
}
.box {
margin-top:10px;
}
#navm {
width:400px;
height:40px;
text-align:center;
line-height:40px;
background:#EE9900;
}
#navm >li {
width:20%;
height:40px;
float:left;
border:1px solid #c5c5c5;
border-bottom:none;
}
#navm >li.active {
background:#fff;
}
#contentm {
width:400px;
height:300px;
position:relative;
border:1px solid #c5c5c5;
border-top:none;
}
#contentm >li {
width:100%;
height:100%;
position:absolute;
display:none
}
#contentm >li>img {
width:402px;
height:100%;
position:absolute;
}
#navl {
width:300px;
height:40px;
text-align:center;
line-height:40px;
background:#c5c5c5;
}
#navl> li {
width:25%;
height:40px;
float:left;
border:1px solid #c5c5c5;
border-bottom:none;
}
#navl >li.active {
background:#fff;
}
#contentl {
width:300px;
height:200px;
position:relative;
border:1px solid #c5c5c5;
border-top:none;
}
#contentl> li {
width:100%;
height:100%;
position:absolute;
padding:10px;
display:none
}
函数分装的tab选项卡,可以嵌套使用。