本文实例讲述了javascript通过获取html标签属性class实现多选项卡的方法。分享给大家供大家参考。具体实现方法如下:
原生javascript通过获取html标签属性class实现多选项卡
.tab {
clear: both;
margin: 20px auto;
padding: 10px;
width: 680px;
overflow: hidden;
}
.tab .tab-menu {
margin: 0;
padding: 0;
list-style: none;
}
.tab .tab-menu li {
display: inline;
margin: 0 2px 0 0;
}
.tab .tab-menu li a {
padding: 0 1em;
text-decoration: none;
color: #a80;
background: #fe5;
}
.tab .tab-menu li a:hover {
background: #fc0;
color: #540;
}
.tab .tab-menu .active {
}
.tab .tab-menu .active a {
padding-bottom: 2px;
font-weight: bold;
color: black;
background: #fc0;
}
.tab .tab-panel {
padding: 1em;
border: 2px solid #fc0;
background: #fff;
}
.tab .tab-panel h2 {
font-size: 1.5em;
color: #fc0;
}
.tab .tab-none {
display: none;
}
111
122
133
211
222
233
311
322
333
希望本文所述对大家的javascript程序设计有所帮助。



