2013-04-07 64 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