将鼠标悬停在 NG-ZORRO（Angular 的 antd）按钮周围时如何移除蓝色边框？答案

【问题标题】：How to remove blue border around NG-ZORRO (antd for Angular) buttons when hovering over them?将鼠标悬停在 NG-ZORRO（Angular 的 antd）按钮周围时如何移除蓝色边框？
【发布时间】：2020-03-14 08:00:40
【问题描述】：

如果您点击此链接，您会看到他们页面上的一些示例。

https://ng.ant.design/components/button/en

我可以访问按钮并更改颜色，但不能更改实际的蓝色边框。我尝试过 :active、:hover、:focus 等。

这是我访问某些自定义 css 按钮的方式

.ant-btn-circle {
  background-color: $theme-foreground !important;
  color: rgb(var(--MainColor)) !important;
}

.ant-btn-circle:focus {
  background-color: rgb(var(--MainColor)) !important;
  color: $theme-foreground !important;
  outline: 0 !important;
}

大纲部分似乎不起作用...有什么提示吗？

我看到类似的东西是蓝色的，但我不知道它是什么。 --antd-wave-shadow-color

html {
font-family: sans-serif;
line-height: 1.15;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
-ms-overflow-style: scrollbar;



--antd-wave-shadow-color: #1890ff;

}

【问题讨论】：

标签： antd ng-zorro-antd

【解决方案1】：

到目前为止，我发现的唯一解决方案是在您的 src 中创建一个 theme.less 文件并添加以下内容：

@import "../node_modules/ng-zorro-antd/ng-zorro-antd.less";

@primary-color: #6D6E70;

所以我猜它是原色。将其设置为自定义会很好。在 CSS 中。

【讨论】：