tab_bootstrap 

<!DOCTYPE html>
<html>
<head>
    <title>tab</title>
    <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
</head>
<body>
<ul id="myTab" class="nav nav-tabs">
    <li class="active"><a href="#home" data-toggle="tab">Home</a></li>
    <li><a href="#ios" data-toggle="tab">User</a></li>
    <li class="dropdown">
        <a href="#" id="myTabDrop1" class="dropdown-toggle" data-toggle="dropdown">Java
            <b class="caret"></b>
        </a>
        <ul class="dropdown-menu" role="menu" aria-labelledby="myTabDrop1">
            <li><a href="#jmeter" tabindex="-1" data-toggle="tab">jmeter</a></li>
            <li><a href="#ejb" tabindex="-1" data-toggle="tab">ejb</a></li>
        </ul>
    </li>
</ul>
<div id="myTabContent" class="tab-content">
    <div class="tab-pane fade in active" id="home">
        <p>1</p>
    </div>
    <div class="tab-pane fade" id="ios">
        <p>2</p>
    </div>
    <div class="tab-pane fade" id="jmeter">
        <p>3</p>
    </div>
    <div class="tab-pane fade" id="ejb">
        <p>4</p>
    </div>
</div>
</body>
</html>

 

posted @ 2016-07-01 14:03  rysly  阅读(196)  评论(0)    收藏  举报