[英]Twitter Bootstrap Icon-bar not Displaying
調整瀏覽器大小時,三個圖標欄中只有兩個顯示。 先前的答案表明人們沒有將其圖標欄放在正確的nav標簽中,但是我這樣做了,這都是正確的。 我的網站在這里可見,但是這里也是我的header.php代碼:
<nav class="navbar navbar-default" role="navigation"> <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div id="logo"> <a href="http://http://www.franhaines.co.uk/paddlethewye/"/> <img src="wp-content/themes/BareTheme/logo.png" alt="Paddle the Wye Logo" border="0" /></a> </div> </div>
您可以使用自己的樣式表來覆蓋引導樣式。
您必須像這樣刪除或指定您的代碼( http://www.franhaines.co.uk/style.css ):
span:not(.icon-bar) {
color: #fff;
font-family: centrale_sans_regularregular, helvetica;
font-size: 30px;
z-index: 80;
position: absolute;
display: block;
top: 50%;
text-align: center;
width: 100%;
}
我在您的頁面上發現了以下規則:
span {
color: #fff;
display: block;
font-family: centrale_sans_regularregular,helvetica;
font-size: 30px;
position: absolute;
text-align: center;
top: 50%;
width: 100%;
z-index: 80;
}
從引導程序。
絕對職位正在打破它; 將span.icon-bar的位置替換為靜態或未設置,它將對其進行修復。
相同的代碼對我來說很好。
<link href = "http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel = "stylesheet"> <nav class="navbar navbar-default" role="navigation"> <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <div id="logo"> <a href="http://http://www.franhaines.co.uk/paddlethewye/"/> <img src="wp-content/themes/BareTheme/logo.png" alt="Paddle the Wye Logo" border="0" /></a> </div> </div>
在這里演示
注意:從這里引導CSS
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.