Javascript 添加目标时CSS焦点不起作用

有没有任何可能的方法可以用css实现这一点，我有一个这样的DOM

.导航栏{ 背景：c30015； 左边距：50像素； 浮动：左； } .nav_bar>ul{ 填充：0； 保证金：0； 显示器：flex； 底边：薄白色固体； 位置：相对位置； } 李国荣先生{ 列表样式：无； } .nav_bar ul li a{ 文字装饰：无； 颜色：ffffff； 显示：块； 右边框：1px实心fff； 填充：8px 16px； } .nav_bar ul li a:悬停{ 背景：e6b3a1； 文字装饰：无； 颜色：c3000f； } .nav_-bar ul-li a:聚焦，.nav_-bar ul-li a:激活{ 背景：e6b3a1； 文字装饰：无； 颜色：c3000f； } .下导航栏{ 背景：e6b3a1； 左边距：34px； 浮动：左； 位置：绝对！重要； 左：0； 宽度：100%； 显示：无； 填充：0； 保证金：0； } .下导航栏李{ 列表样式：无； 显示：内联块； } .下导航栏李a{ 文字装饰：无； 颜色：c3000f； 显示：块； 填充：8px 23px 8px 18px； } .向下导航栏李a：链接{ 文字装饰：无； } 下导航台李a：参观了{ 边框底部：2个c3000f实体； 文字装饰：无； } .向下导航栏李a：悬停{ 边框底部：2个c3000f实体； 文字装饰：无； } .向下导航栏李a：激活{ 边框底部：2个c3000f实体； 文字装饰：无； } .向下导航栏李。激活{ 边框底部：2个c3000f实体； 文字装饰：无； } ：目标{ 显示：块； }

---

您可以通过将id=target移动到包含href=target的锚点并添加以下样式来实现预期结果：

#target:target {
  color: #c3000f;
  background-color: #e6b3a1;
}

#target:target + ul {
  display:block;
}

工作示例：

.导航栏{ 背景：c30015； 左边距：50像素； 浮动：左； } .nav_bar>ul{ 填充：0； 保证金：0； 显示器：flex； 底边：薄白色固体； 位置：相对位置； } 李国荣先生{ 列表样式：无； } .nav_bar ul li a{ 文字装饰：无； 颜色：ffffff； 显示：块； 右边框：1px实心fff； 填充：8px 16px； } 导航栏ul li a：悬停， 导航栏ul li a：聚焦， .nav_bar ul li a：主动， 目标：目标{ 背景：e6b3a1； 文字装饰：无； 颜色：c3000f； } .下导航栏{ 背景：e6b3a1； 左边距：34px； 浮动：左； 位置：绝对！重要； 左：0； 宽度：100%； 显示：无； 填充：0； 保证金：0； } .下导航栏李{ 列表样式：无； 显示：内联块； } .下导航栏李a{ 文字装饰：无； 颜色：c3000f； 显示：块； 填充：8px 23px 8px 18px； } .向下导航栏李a：链接{ 文字装饰：无； } 下导航台李a：参观了{ 边框底部：2个c3000f实体； 文字装饰：无； } .向下导航栏李a：悬停{ 边框底部：2个c3000f实体； 文字装饰：无； } .向下导航栏李a：激活{ 边框底部：2个c3000f实体； 文字装饰：无； } .向下导航栏李。激活{ 边框底部：2个c3000f实体； 文字装饰：无； } 目标：目标+ul{ 显示：块； }

---

你说焦点不起作用是什么意思-现在我在Chrome上，target正在工作，我可以看到每个标签按下时颜色的变化。当你点击第一个按钮时，你可以看到背景发生了变化，第二个按钮也发生了变化，但你点击第三个按钮，背景没有发生变化。希望它能像kermani说的那样正常工作。您使用的是哪种浏览器？能否在plunkr中复制？。。第三个按钮的意思是“购买和计费”或“发票”，你说的“不活动”是什么意思？这就是我要找的，投票给你真是太棒了。让我看看发生了什么事