table切换选项卡

<style>
       
        /*控制选项卡样式*/
        .tabBar {
            border-bottom: 2px solid #1ab394;
            margin-bottom:10px;
        }
        .cl, .clearfix {
            zoom: 1;
            display: block;
        }
        .tabBar span {
            background-color: #e8e8e8;
            cursor: pointer;
            display: inline-block;
            font-weight: bold;
            height: 30px;
            line-height: 30px;
            padding: 0 15px;
        }
        .tabBar span.current {
            background-color: #067fcb;
            color: #fff;
        }
        .tabBar span a{
            color:#222;
        }
        .tabBar span a:hover {
            color: #067fcb; /*鼠标经过的颜色变化*/
        }


    </style>
<div class="tabBar cl"><span class="current"><a href="#" style="color: #fff;">table1</a></span><span><a href="#">table2</a></span><span><a href="#">table3</a></span></div>