1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-22 21:22:52 +02:00

add role="tab" to .panel-heading-s in accordion example to improve accessibility

This commit is contained in:
Chris Rebert
2014-09-08 23:33:26 -07:00
parent f6264b444a
commit 56c8c1bb55

View File

@@ -15,7 +15,7 @@
<div class="bs-example"> <div class="bs-example">
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading" role="tab">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
Collapsible Group Item #1 Collapsible Group Item #1
@@ -29,7 +29,7 @@
</div> </div>
</div> </div>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading" role="tab">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
Collapsible Group Item #2 Collapsible Group Item #2
@@ -43,7 +43,7 @@
</div> </div>
</div> </div>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading" role="tab">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseThree"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
Collapsible Group Item #3 Collapsible Group Item #3
@@ -61,7 +61,7 @@
{% highlight html %} {% highlight html %}
<div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true"> <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading" role="tab">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
Collapsible Group Item #1 Collapsible Group Item #1
@@ -75,7 +75,7 @@
</div> </div>
</div> </div>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading" role="tab">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
Collapsible Group Item #2 Collapsible Group Item #2
@@ -89,7 +89,7 @@
</div> </div>
</div> </div>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading" role="tab">
<h4 class="panel-title"> <h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseThree"> <a data-toggle="collapse" data-parent="#accordion" href="#collapseThree">
Collapsible Group Item #3 Collapsible Group Item #3