更改引导程序分页的背景颜色

Question

我尝试用!import更改分页的背景颜色

static / css / custom_css.css

.pagination>li.active>a {
  background-color: orange !important;
}

源代码：

<nav aria-label="...">
  <ul class="pagination">
    <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>
    <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
    ...
  </ul>
</nav>

我已将其导入顶部

  <link rel="stylesheet" href="{% static 'simplemde/debug/simplemde.css' %}" />

我测试了多种颜色，但不对应

Answer 1

它工作正常，但是您需要像下面这样调用simplemde.css后添加此bootstrap.css

.pagination>li.active>a {
  background-color: orange !important;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 <link rel="stylesheet" href="{% static 'simplemde/debug/simplemde.css' %}" />
 
<nav aria-label="...">
  <ul class="pagination">
    <li class="disabled"><a href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li>
    <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
    ...
  </ul>
</nav>

Answer 2

检查要包括的引导程序版本。最新版本会将活动类别添加到标签中。如果是这样，请像.pagination>li>a.active

那样重写