How to change the button color when it is active using bootstrap?

Question

I am using bootstrap 3. I want to change button color when I click on button.I mean button should be in different color when it is selected. How can I do this using css?

My codes are :

<div class="col-sm-12" id="">     <button type="submit" class="btn btn-warning" id="1">Button1</button>     <button type="submit" class="btn btn-warning" id="2">Button2</button> </div> 

Answer 1

CSS has different pseudo selector by which you can achieve such effect. In your case you can use

:active : if you want background color only when the button is clicked and don't want to persist.

:focus: if you want background color untill the focus is on the button.

button:active{     background:olive; } 

and

button:focus{     background:olive; } 

JsFiddle Example

P.S.: Please don't give the number in Id attribute of html elements.