如何在CSS中设置按钮字体的样式？

Question

更新：看起来，我在这个问题中描述的问题仅影响OS X浏览器。

我想在CSS中更改或更少地更改输入按钮的font样式：

input[type="button"]
{
    font: italic bold 3em fantasy;
}

不幸的是，这在Chrome，Safari和Opera OS X 上效果不佳，除非我也更改默认background-color，我不想这样做。

请参见此处：http://jsfiddle.net/S7y5B/

所以我的问题很简单：如何在不改变背景颜色的情况下更改按钮的字体，以所有浏览器都能理解的方式？在上面的JsFiddle示例中，我想让Button 1看起来像Button 2，但背景颜色不变。怎么办呢？

Answer 1

在摆弄它之后，看起来OSX会改变按钮，尽管他们做了正常的造型。诸如height之类的属性（即使元素设置为display:block），任何font属性和padding都不会呈现。要查看实际样式，必须为元素的border或background设置样式。

似乎color和width属性正常呈现。

Answer 2

你的按钮看起来一样。

修改 OS.X Chrome：

Answer 3

好的，我自己想通了。我使用

设置了按钮的样式

-webkit-appearance: button;

按钮内的文字现在使用预期的字体进行渲染，而无需设置背景颜色。边界看起来仍然有些不同，但这是另一个问题。

JSsFiddle： http://jsfiddle.net/S7y5B/18/