为什么提交输入样式不适用于Safari（Mac）上的Chrome，但仅限于我应用背景色？

Question

我有一个简单的网页，其中CSS样式规则不适用于此 表格的按钮，如果我在Chrome或Safari（Mac OS X，Yosemite）上。 它适用于Firefox。如果我，它确实适用于Chrome和Safari 使用背景颜色属性。

请看以下示例。 save按钮没有Roboto Mono字体，应该是这样。仅当您打开时才会出现此问题 Chrome或Safari上的页面。它在Firefox上运行完美。

最重要的是，如果我在按钮上应用background-color这样的样式，那么字体Roboto Mono突然按预期工作，也会在按钮上应用。

这是我用过的代码。

http://jsbin.com/foqiso/edit?html,css,output

任何线索为什么按钮不采用指定的字体，但仅限于

• 我在使用Firefox或
• 我在Chrome或Safari上，我应用了背景色

更新：还有另一种解决方法。如果我使用<input type="submit" value="Save">，而不是使用<button type=submit>Save</button>，那么button将使用我期望的字体设置样式。

Answer 1

它是您的webkit样式。加上这个：

input[type=submit]{
  -webkit-appearance: button;
}

这只是Webkit

干杯