mac和windows上的输入按钮不同答案

【问题标题】：Input buttons different on mac and windowsmac和windows上的输入按钮不同
【发布时间】：2013-04-14 01:35:05
【问题描述】：

这是我在代码中的按钮：

<!-- CSS Code -->
input {
    height: 100px;
    width: 150px;
    font-size: 55px;
    text-align: center;
}

button {
    width: 87px;
    height: 38px;
    font-size: 12px;
}

<!--  HTML Code -->
<input type="submit" class="button" value="Student">

当我在 macbook 和我的 windows 笔记本电脑上查看这个按钮时，它们看起来都不同。

Mac 操作系统：

Windows 7：

如您所见，Windows 7 版本中的按钮更大，字体更大。我最初是在我的 Macbook 上开发的。我需要更改代码中的某些内容吗？为什么要这样做？

【问题讨论】：

您是否使用了 CSS 重置？
OS X 是否允许您设置按钮样式？此外，您的按钮是input 元素，而不是button，因此它的字体大小为55px。
button != 输入类按钮。
@Blender：input. button 选择器将input 元素与class="button" 匹配，而不是button 元素。
@Guffa：最初的问题将button 作为第二个选择器。

标签： html css windows macos button

【解决方案1】：

在 Mac OS 上看起来font-size 被忽略了，可能是设计使然或被某些浏览器/操作系统设置覆盖。

如果您删除 font-size，按钮现在在两个浏览器中看起来是否相同？如果您需要指定字体大小，您可能会找到一些helpful advice over here。

【讨论】：

是的 55 字体看起来只适用于 Windows 屏幕截图。

【解决方案2】：

试试这个css代码
.button {
宽度：87 像素；
高度：38px;
字体大小：12px；
}

你的按钮 css 代码是一个标签，而不是一个类，所以你的 class="Button" 不起作用，因为不存在这个 css 类

【讨论】：