在Chrome for Mac上设置背景颜色后,HTML按钮变为方形
An *_*ran 4 html macos google-chrome button
在Chrome for Mac上,为什么按钮在设置背景颜色后变为方形(通常是圆角)？
<html>
<body>
<input type="button" id="bt1" value="Click me!" onmouseover="this.style.backgroundColor='red;'" onmouseout="this.style.backgroundColor='transparent';">
</body>
</html>
鼠标悬停在按钮上时的网页:
鼠标悬停在按钮上时的网页:
鼠标悬停在按钮上后的网页:
如何在不使按钮方块的情况下设置背景？
谢谢.
WebKit/Blink将按钮绘制为"-webkit-appearance:push-button",它使用本机API(在本例中为Cocoa)绘制按钮.但是,本机API不支持任意背景颜色.因此,WebKit/Blink会在内部自动删除"-webkit-appearance:push-button",如果Web作者指定了一些CSS属性(如background-color),则会回退到糟糕的CSS绘图.
您无法使用本机按钮外观更改背景颜色.