<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<div id="accordion" class="panel-group">
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
<a href="#panelBodyOne" data-toggle="collapse" data-parent="#accordion">
1. Welche Behandlungsoptionen gibt es?
</a>
</h4>
</div>
<div id="panelBodyOne" class="panel-collapse collapse">
<div class="panel-body">
<ul>
<li>1.1</li>
<li>1.2</li>
<li>1.3</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
<a href="#panelBodyTwo" data-toggle="collapse" data-parent="#accordion">
2. Wie lange kann die Erkrankung andauern?
</a>
</h4>
</div>
<div id="panelBodyTwo" class="panel-collapse collapse">
<div class="panel-body">
<ul>
<li>2.1</li>
<li>2.2</li>
<li>2.3</li>
</ul>
</div>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h4 class="panel-title">
<a href="#panelBodyThree" data-toggle="collapse" data-parent="#accordion">
3. Was löst die akuten Schübe aus?
</a>
</h4>
</div>
<div id="panelBodyThree" class="panel-collapse collapse">
<div class="panel-body">
<ul>
<li>3.1</li>
<li>3.2</li>
<li>3.3</li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
#accordion {
margin: 20px;
}
.panel-group .panel, .panel-heading {
border-radius: 0;
}
.panel-heading {
height: 60px;
}
.panel-primary {
border: none;
}
.panel-title a{
text-decoration: none;
}