无法更改HTML表单提交按钮的字体大小

Question

如何增加提交按钮字体大小？特别是在chrome中,它太小而且文本看起来很压扁. 工作小提琴

body, input {
    font-size: 30px; 
}

我知道有

-webkit-appearance: none;

但这会重置很多其他造型.我想保留默认样式,只是使用不同的字体大小.

Answer 1

如果您设置了 border 或 box-shadow 属性（是的，很奇怪），Webkit 将尊重您的自定义表单元素样式。正如其他人所说，至少从-webkit-appearance: none;（我会添加-moz-appearance: none; appearance: none;）开始，然后参考这个答案“HTML select font-size”

Answer 2

我遇到了类似的问题，但是当我将样式内联放在输入元素中时，它正在工作。所以其他一些样式可能会导致问题。

 <input type="submit" value="Register" style = "font-size:20px">

Answer 3

要更改提交按钮的字体大小，只需使用以下 css 代码：

input[type=submit] {
    font-size: 0.5em;
}

示例： http: //jsfiddle.net/xhf4bLnd/4/

编辑：将 px 更改为 em