html - Mac 上的 <input> 高度

标签 html macos google-chrome safari

以下代码:

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

在 Windows、Linux 等上工作正常。但是 Mac 使用系统按钮样式 <input>标签。这些似乎无法获得自定义高度(Firefox 覆盖了系统按钮样式,所以没问题,但 Mac 上的 Chrome 和 Safari 存在以下问题):

不再是 80px 宽和 200px 高的按钮,而是 Mac 按钮样式和顶部和底部的间隙。宽度设置得很好。

如何覆盖它以便 Mac 上的 Chrome 和 Safari 显示高按钮?

编辑:这是在 Mac 上发生的情况: Mac input{ height: 200px; } problem
以下是应该发生的情况(适用于 Windows、Linux):

Normal input{ height: 200px; }

最佳答案

添加:

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

在你的 CSS 中 :-)

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

关于html - Mac 上的 &lt;input&gt; 高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11009113/

相关文章:

google-chrome - 如何使用Chrome扩展文件系统API?

无法将类型 'UnsafePointer<Double>' 的值转换为预期的参数类型 'UnsafePointer<_>'

objective-c - 如何让我的 NSTextField 在应用程序启动时不突出显示其文本?

html - Chrome 中不显示背景图片

javascript - 将行追加到表格并滚动到页面底部的错误

javascript - Iframe 尝试从安全来源与其顶级框架不同的文档调用 getUserMedia

javascript - Chrome 中的 WebSQL 和 localStorage 范围

html - 验证 CSS 是否与所有浏览器兼容

html - 使用 v-if 根据变量的值显示 html 元素

javascript - 有没有更好的方法来获取 outerHtml?