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

Question

好吧，所以我是一个初学者，但我已经读了很多关于这种情况的文章。但我正在努力把我的品牌形象放在我的导航栏里。

我知道这将是一件愚蠢而琐碎的事情。我总是可以覆盖HTML中的样式，但我更喜欢在自定义css文件中完成。

首先，把显而易见的事情排除在外。我的自定义CSS文件是头中声明的最后一个CSS。我可以修改页面上的其他元素，比如段落元素的颜色，所以我知道CSS文件链接正确。我理解特异性，至少是它的核心概念

试图解决特殊性问题。我首先在我声明的标签中为我的so创建了一个自定义id，并在我的CSS文件中编写了

#logo {
    height: 110%;
}

什么都没有。因此，我尝试更具体地添加每一个可能指向徽标文件的类声明。

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

再次没有运气。我只尝试了.navbar品牌和每一种课程组合。我只是不明白等级制度和谁在优先。如果我的CSS文件在头中最后列出，并且有一个正确指定的类声明，应该会覆盖任何引导程序的代码。

我知道这个问题肯定被问了很多，但经过几个小时的寻找答案，我什么都没找到。

部分的html片段

<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>

Answer 1

问题是您要以百分比的形式指定高度，这需要定义父元素的高度。在Bootstrap 3中，.navbar-brand的父元素是div.navbar-header，并且它没有定义的高度。因此height: 110%;不起作用。因此，您需要以像素定义徽标的高度，或者以百分比定义徽标，并以像素定义div.navbar-header高度。