所以我想知道是否有可能使用引导网格(类似于)来尝试并排放置两个 accordion 。
这是我一直在使用的代码,取自w3schools并做了一些修改。我只是包括了相关的部分,但是如果需要更多的信息,请说出来。
img {
max-width: 100%;
max-height: 100%;
}
.accordion {
background-color: #eee;
color: #444;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
.active,
.accordion:hover {
background-color: #ccc;
}
.panel {
padding: 0 18px;
display: none;
background-color: white;
overflow: hidden;
}
.solid {
border-style: solid;
}
.gainsboro-background {
background-color: gainsboro;
}
.white-box {
background-color: white;
}
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
li a:hover:not(.active) {
background-color: #111;
}
<button class="accordion"><b> Example 1 </b></button>
<div class="panel">
<p> Example 1 </p>
<p> Example 1 </p>
<p> Example 1 </p>
</div>
<button class="accordion"><b> Example 2 </b></button>
<div class="panel">
<p> Example 2 </p>
<p> Example 2 </p>
<p> Example 2 </p>
</div>
我想我可以加上
<div class="container-fluid">
<div class="row">
<div class="col-md-6">
在button类的上面,很明显,还关闭了div元素,但这不起作用。我不知道我该怎么办。
**问题:**是否可以在 accordion 上使用引导网格,使两个 accordion 并排?.
我已经检查了相应的API,我找不到类似的问题。
1条答案
按热度按时间rqdpfwrv1#
在bootstrap中尝试
和演示链接https://jsfiddle.net/kingtaherkings/cxbxs8vj/