提交按钮CSS样式在Mac和Windows之间不同

Question

我正在尝试使用Ajax构建small demo contact form。当我去设置提交按钮的样式时，它正确地采用填充和字体大小。但是在运行OSX Lion的Macbook上，按钮看起来仍然是默认的，没有填充，没有更大的字体大小等。

我经历了几次，我不知道如何解决这个问题。 CSS样式对于所有操作系统通常都是一样的，这就是让我循环...

以下是从两台计算机上截取的两张图片截图，以便您了解我的意思。

Windows 7

OS X Lion

我是否应该使用特殊属性规则来重置Mac样式？我只想编辑提交按钮的字体大小，填充，颜色等。它在所有浏览器中的行为都是这样。

真的很感激任何帮助！

编辑：这是我的代码

<input type="submit" name="submit" value="Send E-mail" id="sendbtn" class="sendbtn">

CSS文件

form .sendbtn { display: block; font-size: 26px; padding: 3px 6px; }

Answer 1

目前，您没有指定任何可以使您的按钮在浏览器中相同的样式。操作系统下的每个浏览器都使用默认样式作为按钮（受主题影响，如果有的话）。您需要指定更多内容，例如background，color，border等。

例如，这应该在浏览器中看起来相同：

form .sendbtn {
  display: block; 
  font-size: 26px; 
  padding: 3px 6px; 
  background:#eee;
  color:blue;
  border:none; /* or whatever */
}

Answer 2

如果你将边框或背景属性添加到按钮的css中，它就会起作用。