html - 更改子元素背景 CSS
问题描述
我是 CSS 的新手,这里的 HTML 结构:
<nav id="navbar" class="navbar navbar-expand-sm">
<a class="navbar-brand ml-4" href="#">
<img src="images/logo-light.svg" alt="" width="30" height="90" class="d-inline-block align-top" id="navlogo">
</a>
<button class="navbar-toggler collapsed border-0" id="navbar-toggler" type="button">
<span> </span>
<span> </span>
<span> </span>
</button>
</nav>
我需要做的是,如果我添加一个类“黑色”,navbar
我需要打开 css 背景颜色navbar-toggler
来变成白色。我如何用 CSS 做到这一点?
我认为它应该是这样的:
. navbar .black .navbar-toggler span{
background: #000 !important;
}
但它不工作
解决方案
你非常亲近。
通过去.navbar .black
,你的目标.black
是在里面.navbar
。但是通过这样做,您的目标是同时具有和.navbar.black
的元素。.navbar
.black
.navbar.black .navbar-toggler span{
background: #FFF!important;
}
推荐阅读
- wordpress - 如何用逗号列出 wordpress 附件 URL?
- javascript - Ajax 调用不适用于公共 Dog API
- microsoft-graph-api - intune 配置 scep 配置文件
- r - 使用 ggplot2,得到强化(数据)错误
- java - 将列表从 Thymeleaf 传递到 Spring 控制器
- ios - 乐天动画在 UIView iOS 中不起作用
- sql-server - SQL Server 可用性组 - 用于服务器故障转移和站点故障转移
- python - 如何使用 Python 在 Selenium 中为给定的 HTML 构建 xpath
- r - ggplot2 在同一图上的离散和连续图例
- java - 正则表达式:多次提取条目