Customizing Bootstrap 3.0 Navbar

Question

我正在使用Bootstrap 3.0，我想通過更改a標記而不是整個li來自定義導航條鏈接。

我想獲得像這樣的http://templates.designorbital.com/baleen/，但是當我改變背景顏色或邊框時，整個.li標籤獲得相同的樣式。

幫助？

編輯：到目前爲止，這是什麼出來http://jsfiddle.net/AvxSN/3/

/* link */ 
.navbar-default .navbar-nav > li > a { 
    color: #555; 

} 
.navbar-default .navbar-nav > li > a:hover { 
    color: #fff; 
    background-color:#000; 
} 
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus { 
    color: #fff; 
    background-color: #000; 
} 

Answer 1

我在你給的代碼示例看到和自己的是，他們有一個保證金和邊界半徑（和不同背景的唯一區別顏色懸停）在a元素上。 nav中的a是顯示塊以填充整個li元素，所以當您更改某些內容時，它會更改整個li，但它與示例代碼相同。用幾行更新你的行以反映示例佈局。讓我知道如果我誤解你：

http://jsfiddle.net/spacebean/AvxSN/4/

/* updated to have same margins as nav items */ 
.navbar-default .navbar-brand { 
    margin: 5px 0; 
} 
.navbar-default .navbar-nav > li > a { 
    color: #555; 
    margin: 5px; 
    border-radius: 4px; 

} 
.navbar-default .navbar-nav > li > a:hover { 
    color: #fff; 
    background-color:#999; 
}