<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<link rel="stylesheet" type="text/css" href="../css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="../css/bootstrap-responsive.css">
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/bootstrap.js"></script>
<script type="text/javascript">
</script>
</head>
<body>
<div class="container" >
<h1 class="page-header">口风琴</h1>
<div class="accordion" id="accordion1">
<div class="accordion-group">
<div class="accordion-heading">
<a href="#a1" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1">显示内容一</a>
</div>
<div class="collapse" id="a1">
<div class="accordion-inner" >
adsda
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a href="#a2" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1">显示内容二</a>
</div>
<div class="collapse" id="a2">
<div class="accordion-inner" >
adsda
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a href="#a3" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion1">显示内容三</a>
</div>
<div class="collapse" id="a3">
<div class="accordion-inner" >
adsda
</div>
</div>
</div>
</div>
</div>
</body>
</html>
也没什么好解释的,全是使用bootstrap提供的类~~