クリック時にブートストラップボタンが変更されていませんか？

Question

私はブートストラップを始めました。ボタンのセットを作成しようとしています。のみがクリックされたときにアクションを実行します（例：ボタンの色を変更しない、アウトラインの色を変更しない、それはhere.ナビゲーションバーのボタンのように同じまま持って）

これは私がこれまで持っているものです：私は、ボタンを宣言する場所

.btn-default { 
    font-family: Monospace; 
    font-size: 20px; 
    color: #F5C173; 
    background-color: #8F390D; 
    border-color: #8F390D; 
    border-radius: 0px; 
} 

.btn-default:hover { 
    background-color: #8F390D; 
    border-color: #8F390D; 
    color: #9F590D; 
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1), -2px 2px 2px rgba(0, 0, 0, 0.1), 2px 2px 2px rgba(0, 0, 0, 0.1); 
} 

そして、ここです：

<nav class="navbar navbar-default navbar-fixed-top"> 
    <div class="container"> 
    <button type="button" class="btn navbar-btn btn-default" style="float: right">about</button> 
    <button type="button" class="btn navbar-btn btn-default" style="float: right">portfolio</button> 
    <button type="button" class="btn navbar-btn btn-default" style="float: right">contact</button> 
    </div> 
</nav> 

基本的には、ボタンをクリックしても、ホバー効果が持続するようにしたい。

ありがとうございます！

Answer 1

単純に次のように、あなたが同じに滞在したいすべてのものの後ろに重要な追加：

.btn-default { 
    font-family: Monospace; 
    font-size: 20px; 
    color: #F5C173!important; 
    background-color: #8F390D!important; 
    border-color: #8F390D!important; 
    border-radius: 0px; 
    box-shadow: none!important; 
} 

.btn-default:hover { 
    background-color: #8F390D!important; 
    border-color: #8F390D!important; 
    color: #9F590D!important; 
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1), -2px 2px 2px rgba(0, 0, 0, 0.1), 2px 2px 2px rgba(0, 0, 0, 0.1)!important; 
}