How to customize Bootstrap 3 tab color

On the selector .nav-tabs > li > a:hover add !important to the background-color.

.nav-tabs{
  background-color:#161616;
}
.tab-content{
    background-color:#303136;
    color:#fff;
    padding:5px
}
.nav-tabs > li > a{
  border: medium none;
}
.nav-tabs > li > a:hover{
  background-color: #303136 !important;
    border: medium none;
    border-radius: 0;
    color:#fff;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/>

<ul class="nav nav-tabs" id="myTab">
    <li class="active"><a data-toggle="tab" href="#search">SEARCH</a></li>
    <li><a data-toggle="tab" href="#advanced">ADVANCED</a></li>
</ul>
<div class="tab-content">
    <div id="search" class="tab-pane fade in active">
        Aliquip placeat salvia cillum iphone. Seitan aliquip quis cardigan american apparel,
        butcher voluptate nisi qui.
    </div>
    <div id="advanced" class="tab-pane fade">
        Vestibulum nec erat eu nulla rhoncus fringilla ut non neque. Vivamus nibh urna.
    </div>
</div>

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)