純色導航欄Twitter Bootstrap

首先我是自舉的總菜鳥。純色導航欄Twitter Bootstrap

我有一個主要問題，試圖找出我的網站的導航欄。

我想要做的唯一的事情就是讓導航欄全黑以及白色文本。當進入手機屏幕時，按鈕應該是相同的。純黑色，右上角有三條白色破折號。

沒有梯度...
沒有陰影...
沒有多餘花哨的東西在所有...

我試圖從我自己的樣式表覆蓋bootstrap.css （如之前的一些帖子所述），因爲我不想混淆原始的CSS。但它永遠不會起作用，我現在正在瘋狂。

任何人都有一個簡單的解決方案，然後我都耳朵。

來源

2013-01-05 hjartstrom

您能告訴我們您嘗試過什麼嗎？ –

@WouterJ當然可以。這和我得到的一樣接近，但是我不得不攪亂bootstrap.css和bootstrap-responsive.css> [link]（http://hjartstrom.com/test-site） – hjartstrom

你不應該在導航列表（我在說'div> ul> li> a> h3'）。標題引入了一段文字（以及內容列表等），這裏是一個'nav'元素（'nav> ul> li> a'）中的列表項目。 – FelipeAls

我認爲你可以很多覆蓋任何梯度background-image，並且它是陰影或半徑更容易，例如：Demo (jsfiddle)

a, 
.btn, 
.navbar-inner, 
.btn-navbar, 
.progress, 
.progress .bar { 
    background-image: none!important; 
} 

* { 
    -webkit-box-shadow: none!important; 
    -moz-box-shadow: none!important; 
      box-shadow: none!important; 

    text-shadow: none!important; 

    -webkit-border-radius: 0!important; 
    -moz-border-radius: 0!important; 
      border-radius: 0!important; 
}

如果你喜歡，使其更加準確和瀏覽器可能較輕，你應該嘗試修改較少混入（或者至少重寫Less代碼），因爲您不必在任何地方更改n*∞行，只需少數（請參閱mixins.less）

來源

2013-01-06 02:47:59 Sherbrow

這真的很好！它不會變黑，但我想我可以弄清楚。謝謝@Sherbrow – hjartstrom

@hjartstrom您只需更改顏色，然後在[自定義頁面]（http://twitter.github.com/bootstrap/customize.html#variables）中檢查'@ navbarBackground' – Sherbrow

去除a.btn.btn-navbar.btn類似乎與您的按鈕來解決視覺問題，雖然我只跟你在評論中提供的鏈接進行了測試，而不是與原Twitter的引導代碼新的一頁

來源

2013-01-05 23:50:05 FelipeAls

謝謝菲利普！我正在這個時刻在未受破壞的bootstrap.css/bootstrap-responsive.css中創建新頁面。但似乎我不能讓導航欄變黑，不管我怎麼做。如果你想看一下，讓我知道。 – hjartstrom

'.navbar-inverse .navbar-inner {background-color：＃000000; }在Firebug中出現，圖像編輯器確認整行背景爲黑色。雖然文本有一個'＃777'color和一個帶有一些rgba（）值的'text-shadow'。 – FelipeAls

純色導航欄Twitter Bootstrap

回答

相關問題