Blazor 单击图像按钮后，图像有边框答案

【问题标题】：Blazor After clicking an image button, the image has a borderBlazor 单击图像按钮后，图像有边框
【发布时间】：2020-02-05 00:56:55
【问题描述】：

我正在为我的一个 Blazor Nuget 包构建一个示例项目，我遇到了一个通常只在 Windows 窗体类型项目中看到的问题。

点击箭头按钮后，按钮有边框：

在 Windows 窗体世界中，我会将焦点设置到屏幕外的文本框或控件。

如果有点击后的 CSS 设置，也许可以解决问题，或者如果有人知道清除按钮焦点的方法？

我的按钮只是一个简单的按钮：

<button class="nextbutton" @onclick="NextButton_Click"></button>

还有下一个按钮的 css：

.nextbutton 
{
    display: inline-block;
    border: none;
    width: 52px;
    height: 64px;
    background-image: url('../images/buttons/bluearrowright.png');
    background-color: transparent;
    transform: scale(0.75);
    transform-origin: left;
}

如果有 CSS 技巧，或者只是将焦点设置到屏幕外的某些内容的方法，请提前致谢，如果您向我展示 JavaScript，我会同意的。

【问题讨论】：

标签： c# css blazor

【解决方案1】：

这是我的答案的来源。我已经在这里投票了。

How to remove focus around buttons on click

.nextbutton:focus 
{
  outline: none;
}

我在发帖之前确实搜索过，但是在等待答案的时候我搜索了更多并找到了上面的帖子。完美运行。

【讨论】：