2013-04-07 100 views
0

因此,我使用bootstrap和HTMl樣板啓動網站。我在從bootstrap編寫品牌類時遇到問題。在main.css中,我添加了一個.navbar .brand類,並試圖將float更改爲top。當我在瀏覽器中加載我的網頁時,main.css中的.navbar .brand是空白的(根據螢火蟲)。我可以在使用螢火蟲的同時編輯引導程序的浮點值,但似乎無法使用我自己的樣式表進行覆蓋。從網站缺少的CSS

<link rel="stylesheet" href="css/bootstrap-responsive.min.css"> 
    <link rel="stylesheet" href="css/main.css">   
    . 
    . 
    . 
    <div class="navbar navbar-inverse navbar-fixed-top"> 
     <div class="navbar-inner"> 
      <div class="container"> 
       <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
        <span class="icon-bar"></span> 
       </a> 
       <a class="brand" href="">Alex</a> 

在bootstrap.css

.navbar .brand { 
    display: block; 
    float: left; 
    padding: 17px 20px 17px; 
    margin-left: -20px; 
    font-size: 20px; 
    font-weight: 200; 
    color: #ffffff; 
    text-shadow: 0 1px 0 #013435; 
} 

中的main.css

.navbar .brand { 
    float: top; 
} 

,然後在螢火當我在看的元素

.navbar .brand {  main.css (line 27) 
} 

回答

1

的問題是float:top不是一個有效的規則。所以瀏覽器可以識別選擇器,但不能識別你所應用的規則。

這些是可能的值float

  • float: left
  • float: right
  • float: none
  • float: inherit

有用文章:https://developer.mozilla.org/en-US/docs/CSS/float

+0

呸,這是煩人。我首先嚐試了螢火蟲的價值,它似乎垂直移動我的文字。感謝你的回答。 – AlexLordThorsen 2013-04-07 09:31:32

+0

在Firebug中,您可能會取消浮動。嘗試使用'float:none;'。 – 2013-04-08 09:37:19