2015-01-22 5 views
0

У меня есть 3 вкладки и желаю, чтобы при выборе вкладки изменился цвет фона. что-то вроде этогоКак изменить цвет фона с изменением вкладки

enter image description here

В настоящее время рабочего кода, который у меня есть

<div class="row"> 
    <div class="col-lg-12"> 
     <ul id="myTab" class="nav nav-tabs nav-justified"> 
      <li class="active"><a href="#service-one" data-toggle="tab"><i class="fa fa-tree"></i> Service One</a> 
      </li> 
      <li class=""><a href="#service-two" data-toggle="tab"><i class="fa fa-car"></i> Service Two</a> 
      </li> 
      <li class=""><a href="#service-three" data-toggle="tab"><i class="fa fa-support"></i> Service Three</a> 
      </li> 
     </ul> 

     <div id="myTabContent" class="tab-content"> 
      <div class="tab-pane fade active in" id="service-one"> 
       <h4>Service One</h4> 
       <p>Lorem ipsum dolor sit</p> 
      </div> 
      <div class="tab-pane fade" id="service-two"> 
       <h4>Service Two</h4> 
       <p>Lorem ipsum dolor sit</p> 
      </div> 
      <div class="tab-pane fade" id="service-three"> 
       <h4>Service Three</h4> 
       <p>Lorem ipsum dolor sit</p> 
      </div> 
     </div> 

    </div> 
</div> 

Но я не хочу любой цвет фона для выбранного содержимого вкладки, только цвета вкладки должен получить chanaged. был бы признателен за любую помощь

+1

Вы уже написали код CSS для этого? –

+0

@Rahul Desai Я взял ссылку из нескольких вопросов, отправленных в stackoverflow, но они не сработали для меня. – Sam

+0

похоже, что вы используете boostrap, так? –

ответ

0
#myTab li.active a{background:blue;color:white;} 

Попробуй, если я получу тебя.

Thanks

0

Ну так как вы используете boostrap я думаю, что активный класс active

добавить к вашей CSS

#myTab .active{background: blue} 

Посмотрите на этот navbar

enter image description here

Смежные вопросы