Twitter的引導覆蓋了```在navbar`

如何navbarTwitter的引導覆蓋了```在navbar`

上a ovveride padding我得到了下面的CSS規則

.navbar .nav > li > a { 
    float: none; 
    padding: 10px 15px 10px; 
    color: #555555; 
    text-decoration: none; 
    text-shadow: 0 1px 0 #ffffff; 
}

，我想有padding: 5px, 5px, 5px

來源

2012-11-28 Jackie Chan

打開CSS樣式表和Ctrl + F。輸入「.navbar .nav> li> a」 –

我懷疑你沒有使用Twitter bootstrap –

爲什麼？如下面的聲明，您可以在4380行找到它。並且可以使用find函數輕鬆找到它。 –

使用引導程序時出現問題，它很好，直到你必須修改它。

我發現你的特定規則，進入bootstrap.css並搜索「.navbar .nav」（我也在ruby on rails項目中使用bootstrap），它是在4380行左右。（這是爲了縮小版本）

所以，你有幾種選擇：

你可以找到它並修改規則存在。
如果你只需要幾個，你可以重寫它。你可以把它放在一個你知道的css文件中（我假設你使用的是rails），rails會預編譯它，然後再推薦規則（在css中最後一個規則是應用的規則）。
或者您可以編寫自己的規則並在規則末尾使用!important。這將是這樣的：
```
.navbar .nav > li > a { 
    padding: 5px 5px 5px !important; 
} 
```

這是危險的，（它可以使其難以維持長遠來看你的CSS）。但仍然是一個有效的選擇，如果一切都失敗了。

作爲說明：您實際上應該使用未縮小版本的bootstrap進行開發。當rails編譯您的資產進行部署時，它會爲您縮減。使修改第三方文件100x更容易處理。

（這還假定您不使用引導寶石導入你的CSS，在這種情況下看到上面的選項之一）

來源

2012-11-28 14:49:31 Ryan

完成！偉大的工作，隊友 –

@DanMyasnikov是的，我最近不得不做同樣的事情。這是一個痛苦:( – Ryan

最好不要直接修改引導程序 - 使用！對你自己的規則很重要 - 如果需要更容易更新引導文件 – niico

要「覆蓋」我們需要一個更具體的規則的樣式。接受的答案使用!important規則，其中should be a last resort。像CSS一樣，我們有很多選項可供選擇。

選項1：創建一個附加的類

.primary.navbar .nav > li > a { 
    padding: 5px 5px 5px; 
}

選項2：重複一類

.navbar.navbar .nav > li > a { 
    padding: 5px 5px 5px; 
}

W3C:

相同的簡單選擇的重複occurrances是人低和做增加特異性。

選項3：使用同一類，但引導

後定義了這個類。如果你不知道這也已經，type="text/css"isn't required in HTML5

.navbar .nav > li > a { 
    padding: 5px 5px 5px; 
}

來源

2014-07-25 13:10:38

正好趕上，大聲笑:) –

@JackieChan我知道，哈哈。 –

您可以添加一個類my-padding到您的元素和使用以下在您的app.css您鏈接到您的html後bootstrap.css

.navbar-nav > li > .my-padding { 
 
    padding: 5px 5px 5px; 
 
}

來源

2015-02-10 10:12:05 spankr

Twitter的引導覆蓋了```在navbar`

回答

相關問題