<输入> Mac上的高度 [英] <input> height on Mac

问题描述

以下代码：

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

在Windows，Linux等平台上工作良好。但Mac对<$ c $使用系统按钮样式c>< input> 标签。这些似乎无法给定一个自定义高度（Firefox覆盖了系统按钮样式，所以没问题，但Mac和Chrome浏览器存在以下问题）：

取而代之具有80像素宽和200像素高按钮的Mac按钮样式和顶部和底部的间隙。宽度设置正常。

我如何覆盖这个，以便Chrome上的Chrome和Safari显示一个高大的按钮？

编辑：这是Mac上发生的事情：


以下是应该发生的事情（适用于Windows，Linux）：

解决方案

$ b

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

在您的CSS中： - ）

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

The following code:

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

Works fine on Windows, Linux etc. However Mac uses the system button style for <input> tags. These seem to not be able to be given a custom height (Firefox overrides the system button style so it's fine but Chrome and Safari on Mac have the below problem):

Instead of having a 80px wide and 200px high button there is the Mac button style and a gap on top and below. The width gets set fine.

How do I override this so that Chrome and Safari on Mac show a tall button?

EDIT: Here's what happens on Mac:
Here's what should happen (works on Windows, Linux):

解决方案

Add :

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

in your CSS :-)

Here is the list of all values this property can take. By default, WebKit uses a custom style (with fixed height) for the buttons.

这篇关于&LT;输入&GT; Mac上的高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！