更改标题的背景颜色不起作用

Posted

技术标签:

【中文标题】更改标题的背景颜色不起作用【英文标题】:Changing background-color of header is not working 【发布时间】:2021-07-09 21:31:59 【问题描述】:

您好,这是我关于***的第一个问题,请原谅我的经验不足。

我正在尝试使用元素上的背景颜色更改整个 html 文档的背景颜色,尽管某些文档会更改颜色,但我无法更改背景颜色,我尝试使用内联 css 更改它元素,它不起作用,但我可以更改高度属性。

这困扰了我好几个小时,我很困惑。

这是我的第一个使用 MVC 模型的 ASP.net Core Web 应用程序,所以我使用的是自动生成的文件“_Layout.cshtml”

 <body style="background-color: #767678;">
<header style="background-color: #767678; height:100px;">


    <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
        <div class="container">
            <a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index">MovieLover</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
                    aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>
            <div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
                <partial name="_LoginPartial" />
                <ul class="navbar-nav flex-grow-1">
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark" asp-area="" asp-controller="Movies" asp-action="Index">Movies</a>
                    </li>
                    <li class="nav-item">
                        <img src="https://users.iee.ihu.gr/~it174985/imgs/search.svg" />
                    </li>
                    <li class="nav-item">
                        <input type="text" value="Search" style="margin-top:5px; width:600px" />
                    </li>
                </ul>
            </div>
        </div>
    </nav>
</header>

我还发布了该网站的图片,以便您查看它的外观。 => 1

感谢大家的宝贵时间,我们将不胜感激

【问题讨论】:

你检查了导航栏类的css吗?还从导航中删除类 navbar-light 和 bg-white 并尝试 非常感谢我从课堂上删除了 navbar-light 和 bg-white 并且它正在工作! 从这个修复中我可以看出这是一个 css 优先级问题,我想 nav 优先考虑它从类中获得的 css 而不是内联 css 但它不应该是相反的方式吗?由于类,内联 css 优先于它继承的 css? no.. 这不是优先级问题....您的标题内联 css 正在工作...但是您将导航栏放在标题上方...所以标题颜色位于导航的背面。 nav bg 颜色来自类 nav-light 和 bg-white。它就像导航层下面的标题层 【参考方案1】:

在 J Manish 博士回复之后,问题已得到解决,我所要做的就是从导航元素中删除 navbar-light 和 bg-white

【讨论】:

很高兴知道您的问题已解决。

以上是关于更改标题的背景颜色不起作用的主要内容,如果未能解决你的问题,请参考以下文章

使用jquery动态更改背景颜色后,背景颜色的CSS悬停选择器不起作用

更改文本框输入的背景颜色在为空时不起作用

单击/触摸事件的背景颜色更改在触摸设备上不起作用

使用 jQuery 尝试更改文本框的背景颜色但在 wordpress 中不起作用

悬停时背景颜色变化不起作用(jquery)

使用 UIAppearence 设置 UITableViewCell 选择的背景颜色不起作用