<输入> Mac 上的高度答案

【问题标题】：<input> height on Mac<输入> Mac 上的高度
【发布时间】：2012-06-16 01:41:24
【问题描述】：

以下代码：

<input style="height: 80px; width: 200px;" value="test button">

在 Windows、Linux 等系统上运行良好。但是 Mac 使用系统按钮样式来处理 <input> 标签。这些似乎无法自定义高度（Firefox 会覆盖系统按钮样式，所以没问题，但 Mac 上的 Chrome 和 Safari 存在以下问题）：

没有 80 像素宽和 200 像素高的按钮，而是 Mac 按钮样式和顶部和下方的间隙。宽度设置得很好。

如何覆盖此设置，以便 Mac 上的 Chrome 和 Safari 显示一个高按钮？

编辑：这是在 Mac 上发生的情况：
以下是应该发生的事情（适用于 Windows、Linux）：

【问题讨论】：

【解决方案1】：

添加type="button"后试试

<input style="height: 80px; width: 200px;" value="test button" type="button">

【讨论】：

【解决方案2】：

添加：

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

在你的 CSS 中:-)

Here 是该属性可以采用的所有值的列表。默认情况下，WebKit 对按钮使用自定义样式（具有固定高度）。

【讨论】：