Question

所以我现在已经开始这么长时间了，并且非常希望能够帮助定制这款Bootstrap 4手风琴。

我想要卡片的背景＆amp;链接透明，字体大小已更改，字体颜色已更改且没有下划线。我迷上了每一个ID＆amp;可能使用默认类和特殊类，使用！important并且没有运气。 Bootstrap 4文档仅提供颜色有限的内联样式。

.testing {
  background-color: transparent !important;
}

.special-card {
  background-color: transparent !important;
}

.special-card a {
  color: grey !important;
  font-size: 15px !important;
  text-decoration: none !important;
}

.special-card a:hover {
  color: white !important;
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/>

<div class="panel-group" id="accordion">
  <div class="card text-center">
    <div class="card-header testing">
      <h6 class="card-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Title</a>
      </h6>
    </div>
    <div id="collapseOne" class="panel-collapse collapse">
      <div class="card-block special-card">
        <a href="" class="list-group-item">Link 1</a>
        <a href="" class="list-group-item">Link 2</a>
        <a href="" class="list-group-item">Link 3</a>
      </div>
    </div>
  </div>
</div>

Answer 1

您可以尝试以下代码我已将背景颜色添加到正文中，您可以根据需要进行更改

HTML

abdc

CSS

<div class="panel-group" id="accordion">
  <div class="card text-center testing">
    <div class="card-header ">
      <h6 class="card-title">
        <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">Title</a>
      </h6>
    </div>
    <div id="collapseOne" class="panel-collapse collapse">
      <div class="card-block special-card">
        <a href="" class="list-group-item">Link 1</a>
        <a href="" class="list-group-item">Link 2</a>
        <a href="" class="list-group-item">Link 3</a>
      </div>
    </div>
  </div>
</div>

无需使用！important flag ..

希望这会有所帮助 Here is a link for reference

用于手风琴卡的Bootstrap 4自定义样式CSS

1 个答案: