.accordion-box {
position:relative;
padding:15px;
background:#fff;
}
.accordion-box .list-item {
position:relative;
display:block;
margin-bottom:-1px;
background-color:#fff;
border-top:1px solid #dedede;
border-bottom:1px solid #dedede;
}
.accordion-box .list-item-title {
padding:15px 0;
position:relative;
}
.accordion-box .list-item-content {
background-color:#fff;
display:none;
box-sizing:border-box;
overflow:hidden;
}
.accordion-box .title-icon {
position:absolute;
top:15px;
right:15px;
transform:rotate(0deg);
-ms-transform:rotate(0deg);
/* IE 9 */
-moz-transform:rotate(0deg);
/* Firefox */
-webkit-transform:rotate(0deg);
/* Safari 和 Chrome */
-o-transform:rotate(0deg);
-webkit-transition:all .5s ease-in-out;
-moz-transition:all .5s ease-in-out;
-o-transition:all .5s ease-in-out;
transition:all .5s ease-in-out;
}
.accordion-box .title-icon-active {
transform:rotate(90deg);
-ms-transform:rotate(90deg);
/* IE 9 */
-moz-transform:rotate(90deg);
/* Firefox */
-webkit-transform:rotate(90deg);
/* Safari 和 Chrome */
-o-transform:rotate(90deg);
}
如何引入bootstrap.css会显示箭头,自己也可以在
<span class="title-icon title-icon-active"><i class="glyphicon glyphicon-chevron-right"></i></span>
通过其他方式添加