活躍的非鏈接導航欄項目

Question

我有一個標準的引導導航欄，看起來像這樣：

<nav class="navbar navbar-default"> 
    <div class="container"> 
     <ul class="nav navbar-nav"> 
      <li class="active"><a href='#'>Item 1</a></li> 
      <li><a href='#'>Item 2</a></li> 
      <li><a href='#'>Item 3</a></li> 
      <li><a href='#'>Item 4</a></li> 
     </ul> 
    </div> 
</nav> 

當前網站的部分被標記爲active類，它工作正常。現在，我希望導航條目Item 1在當前頁面是一個Item 1鏈接（因爲指向當前頁面的鏈接沒有意義）時不是鏈接，但我仍然希望它被高亮顯示爲活動頁面。問題是，一旦從li刪除a元素突出顯示下降。

我試圖簡單地丟棄錨標記：

  <li class="active">Item 1</li> 

把p.navbar-text圍繞項目：

  <li class="active"><p class='navbar-text'>Item 1</p></li> 

和一些其他的東西，沒有到目前爲止的工作。

我明白，我可以這樣做：

  <li class="active"><p class='navbar-text' style='background-color: #e7e7e7; padding: 15px; margin: 0'>Item 1</p></li> 

得到我想要的東西。此外，這似乎工作：

  <li class="active"><a>Item 1</a></li> 

但它的語義錯誤。

有沒有可能在這種情況下添加我自己的CSS？

Answer 1

從我所看到的，less files for the navbar只適用於這種造型錨元素。你可以複製這個樣式來應用於span或p之類的東西供你使用，但是默認的引導程序css沒有辦法以其他方式使用它。