Css 使聚焦按钮看起来像非聚焦按钮

在特定的div中，我希望使聚焦按钮看起来与非聚焦按钮完全相同

有没有一种方法可以用sass/scss来表达

类似于此：

.myDiv {

 > button {

    &:focus {
      @extend &:not(&:focus)
    }
  }
}

或者，我可以禁用仅因为pseudo class:focus的定义而应用的所有规则吗？

您可以使用。大致如下：

%钮扣{ 颜色：红色； } 钮扣{ @扩展%按钮； &：焦点{ 颜色：绿色； } } myDiv先生{ >按钮：焦点{ //再次从%按钮扩展，从而通过特殊性覆盖。 @扩展%按钮； } } 你可以用。大致如下：

%钮扣{ 颜色：红色； } 钮扣{ @扩展%按钮； &：焦点{ 颜色：绿色； } } myDiv先生{ >按钮：焦点{ //再次从%按钮扩展，从而通过特殊性覆盖。 @扩展%按钮； } }

---

通过执行以下操作，您可以简单地覆盖默认样式

myDiv先生{ >钮扣{ &：焦点{ 大纲：无； } } } 如果需要使用extend，可以这样做

%无焦点{ 大纲：无； } myDiv先生{ >钮扣{ &：焦点{ @扩展%无焦点； } } }

---

但是，我建议您阅读a11y项目的内容，这就解释了为什么在可访问性方面取消样式不好：聚焦元素。

您可以通过下面的操作简单地覆盖默认样式

myDiv先生{ >钮扣{ &：焦点{ 大纲：无； } } } 如果需要使用extend，可以这样做

%无焦点{ 大纲：无； } myDiv先生{ >钮扣{ &：焦点{ @扩展%无焦点； } } }

---

但是，我建议您阅读a11y项目——这解释了为什么在易访问性方面不适合使用un样式：聚焦元素。

这里，我简单解释一下。请参阅下面的代码

HTML:

我的纽扣 SCSS：

* { 大纲：无； } mydiv先生{ 钮扣{ 边框：1px000； &：焦点{ 边框：1px实心ccc； } } }

---

在这里，我简单地解释一下。请参阅下面的代码

HTML:

我的纽扣 SCSS：

* { 大纲：无； } mydiv先生{ 钮扣{ 边框：1px000； &：焦点{ 边框：1px实心ccc； } } }

---

AFAIK scss@extend仅适用于类和占位符类为什么不简单>按钮，>按钮：焦点{？@Connum因为按钮：焦点可能会从其他地方继承我想要覆盖的规则FAIK scss@extend仅适用于类和占位符类为什么不简单>按钮，>按钮：焦点{？@Connum因为button:focus可能会从其他地方继承规则，我想被覆盖它实际上不是关于大纲，它是关于在项目中其他地方定义的某种样式，我不想在这种情况下应用它。啊，仅仅创建一个类或占位符来覆盖你想删除和删除的样式不是更容易吗然后@extend that？例如，如果您不希望background:red；出现在该按钮上，请创建一个background:none的占位符；您可能需要！important！然后只在您不希望有红色背景的元素上扩展该类？@ferenjito它实际上不是关于大纲，而是关于项目中其他地方定义的某种样式我不想在这种情况下应用ect。啊，制作一个覆盖要删除的样式的类或占位符，然后@扩展它不是更容易吗？例如，如果你不想背景：红色；要在这个按钮上，请创建一个背景为：无的占位符；你可能需要！重要信息，然后扩展该类在你不想有红色背景的元素上？@Ferenjito