如果只添加了一个样式,html按钮焦点/轮廓的行为会有所不同,至少在Chrome83中是这样

我正在体验一种不同的HTML按钮行为,只需添加一个简单的背景色(例如,它可以是一个边框半径)。

<button>Button with no style</button>
<button style="background-color: pink">Button with background-color</button>

首先,似乎将一些样式设置为按钮,浏览器会改变一些内置样式/行为,我在最新的Chrome 83中看到它们是这样的:

左边的按钮可以通过TAB键聚焦(显示轮廓),但是如果按钮不是焦点并且被单击,则轮廓不会显示。

相反,如果单击右侧的按钮,则会显示并保留大纲。

我想有相同的行为,左按钮,使按钮与键盘的焦点和轮廓显示,但当我点击它(它不是焦点),我不希望轮廓出现,并保持可见。

<button>Button with no style</button>

<button style="background-color: pink">Button with background-color</button>