thanh thu gọn bootstrap chuyển sang màu trong suốt khi cửa sổ bị giảm

Question

có vấn đề với nền phản hồi khởi động của tôi.

như được thấy bên dưới, khi cửa sổ của tôi bị giảm để mô phỏng kích thước màn hình thiết bị di động, trình đơn thả xuống của tôi trở nên trong suốt.

navbar http://i44.tinypic.com/rw49p4.png

đây là mã của tôi, mà đã được sao chép từ các trang web mẫu bootstrap, sự thay đổi duy nhất tôi làm là liên kết.

<div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" href="#">Project name</a> 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
      <li class="active"><a href="#">Dashboard</a></li> 
      <li><a href="#pages">Pages</a></li> 
      <li><a href="#extensions">Extensions</a></li> 
      <li class="dropdown"> 
       <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> 
       <ul class="dropdown-menu"> 
       <li><a href="#">Action</a></li> 
       <li><a href="#">Another action</a></li> 
       <li><a href="#">Something else here</a></li> 
       <li class="divider"></li> 
       <li class="dropdown-header">Nav header</li> 
       <li><a href="#">Separated link</a></li> 
       <li><a href="#">One more separated link</a></li> 
       </ul> 
      </li> 
      </ul> 
      <div class="navbar-right"> 
      <p style="color:#fff;">some text</p> 
      </div> 
     </div><!--/.navbar-collapse --> 
     </div> 
</div> 

[EDIT] tôi có điều này trong phần đầu của tôi

<meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <meta name="description" content=""> 
    <meta name="author" content=""> 

Answer 1

tôi đã cùng một vấn đề, tôi giải quyết vấn đề bằng cách thêm một tài sản position: relative; css trong div nav:

<div class="navbar navbar-fixed-top> 

đã tham gia:

<div class="navbar navbar-fixed-top" style="position: relative;"> 

Answer 2

Chỉ cần chạy vào điều này. Thêm một kiểu nền cho các yếu tố .navbar-collapse ...

<div class="navbar-collapse collapse"> 

trở thành

<div class="collapse navbar-collapse" style="background:black"> 

Điều này dường như để sửa chữa các vấn đề đối với tôi, hy vọng nó sẽ giúp bạn!

Answer 3

Điều này xảy ra khi bạn khóa chiều cao của thanh điều hướng. Kiểm tra css và thay đổi:

height: 50px; 

vào đây:

min-height: 50px; 

Chúc may mắn.

Answer 4

Không có giải pháp nào ở trên phù hợp với tôi. Nhưng khi tôi đưa cho tôi navbar chỉ số z cao hơn đáng kể như z-index: 9999;, độ trong suốt biến mất.

Answer 5

bạn phải thêm nền trong navbar li một, mẫu mã này css: .navbar li a, .navbar .navbar-brand { color: #fff !important; background-color: #08A2FA; line-height: 1.42857143 !important; /* this for line in desktop mode */ }

Answer 6

Đã cùng một vấn đề

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse" style="color: black"> 
      <span class="sr-only ">{% trans "Toggle Navigation" %}</span> 
      <span class="icon-bar grey_dark_l_bg"></span> 
      <span class="icon-bar grey_dark_l_bg"></span> 
      <span class="icon-bar grey_dark_l_bg"></span> 
     </button> 

Bạn có thể bị thiếu màu nền của .icon-bar. Tôi đã đặt nền của thanh điều hướng thành màu trắng để đó là vấn đề của tôi.

Mã hóa hạnh phúc