单击时从按钮中删除轮廓

Question

#hamburger-btn :focus :active{
outline: 0 !important;
border: 0 !important;
}

<button id="test">
  <div id="hamburger-btn">
    <span></span>
    <span></span>
    <span></span>
    <span></span>
  </div>
</button>

我试图在单击时从汉堡btn中删除蓝色轮廓，但是它不起作用。我的html如下：

但是它不起作用

Answer 1

空格是descendant combinator，您并不是要定位按钮的后代，而是定位按钮本身。

从选择器中删除后代组合器。

---

还请注意，要添加OR条件，您将需要使用identifier并重复两部分之间共享的选择器的每个部分。

---

还请注意，焦点应用于按钮内的按钮，而 not 应用于按钮内的div，因此首先需要将正确的元素定位为目标。 / p>

---

危险：焦点指示器是重要的辅助功​​能。不是每个人都可以或想要使用鼠标。他们可能需要知道焦点在文档中的位置以便与其进行交互。重新考虑删除焦点的所有迹象。

请勿执行此操作

---

,

#test:focus,
#test:active {
  outline: 0;
}