Bootstrap自定义CSS特异性不覆盖品牌形象

好吧，所以我是初学者，但在这种情况下我读了一个体面的数字。但我正在尝试将我的品牌形象放入导航栏中。Bootstrap自定义CSS特异性不覆盖品牌形象

我知道这将是愚蠢和小事。我总是可以覆盖HTML中的样式，但我更喜欢在自定义CSS文件中完成它。

第一件事是第一件事情，明显地避开它。我的自定义CSS文件是头部声明的最后一个CSS文件。我能够修改页面上的其他元素，比如段落元素的颜色，所以我知道CSS文件链接正确。我明白特异性，至少是它的核心概念。

尝试解决特定性问题。我第一次做了一个自定义ID为我左右的时间内，我宣布标识，在我的CSS文件，我写

#logo { 
    height: 110%; 
}

没有。所以我尝试更具体，并添加可能指向徽标文件的每一个类声明。

#logo .nav .navbar .navbar-inverse .navbar-fixed-top .navbar-brand { 
... 
}

再次没有运气。我尝试了.navbar品牌和每一个类的组合。我只是不理解层次结构，谁在优先考虑。我的CSS文件，如果在头文件中最后列出，并带有正确指定的类声明，应覆盖任何引导程序的代码。

我知道这个问题必须要问很多，但经过几个小时寻找答案，我没有找到它的任何地方。部分

<div class="navbar-header"> 
    <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
    </button> 
    <a href="#" class="navbar-brand"> 
     <img id="logo" src="images/logo.png" alt="Limit Magazine"> 
    </a> 
</div>

来源

2015-03-25 Kaze9

你可以发布html代码片段，只有一个孩子上面的标志容器就足够了。 – blushrt 2015-03-25 07:32:32

@blushrt我将它添加到帖子中，唯一较大的div是打开导航部分的那个

事情的

HTML代码段是您指定的百分比高度，这就要求高，难以定义的父元素。在Bootstrap 3中，.navbar-brand的父元素为div.navbar-header，它没有定义的高度。由于这个原因height: 110%;不起作用。因此，您需要以像素为单位定义徽标的高度或以百分比定义它，并定义以像素为单位的高度。

来源

2015-03-25 07:41:30

谢谢你这样做解决这个问题。我在我的检查员注意到.navbar品牌有一个50px的集合高度，但整条线穿过它。这是否意味着.navbar品牌的CSS规则由于其他原因而被忽略。 – Kaze9 2015-03-25 07:47:46

随时欢迎您！请随时将我的答案标记为已接受:)这意味着这些CSS规则会被其他地方覆盖。它可能是同一个CSS文件或不同的文件。 – 2015-03-25 07:53:50

啊，好的，再次感谢你。 – Kaze9 2015-03-25 07:59:19

Bootstrap自定义CSS特异性不覆盖品牌形象

回答

相关问题