html - 为什么 input 不能设置高度？

Answer 1

这个问题我也遇到过，最后解决办法就是这样如下：

  <style>
    input[type=button] {
      appearance:button;
      -moz-appearance:button; /* Firefox */
      -webkit-appearance:button; /* Safari 和 Chrome */
      box-sizing:border-box;
      -moz-box-sizing:border-box; /* Firefox */
      -webkit-box-sizing:border-box; /* Safari */;
      padding: 0;
      width: 100px;
      height: 50px;
    }
  </style>
  <input type="button" value="0">
  <input type="button" value="0">

appearance属性将元素呈现为按钮。box-sizing:border-box;令浏览器呈现出带有指定宽度和高度的框，并把边框和内边距放入框中。

Answer 2

谢谢邀请。input是行内标签。你可以使用css的line-height设置高度。你试试看

Answer 3

input可以设置宽高的，你的样式不起作用？

Answer 4

让它display:inline-block就好了

Answer 5

input是行列块元素，是可以设置宽高的。
我刚刚出现了和你一样的问题，我自己觉得很奇怪，现在明白了，给个背景或者边框就可以看到了变化了。
当你设置width的时候，你马上就可以看到变化；
当你设置height没看到变化，你在给input添加一个background或者border就可以看到height的变化了。
不需要加什么前缀！

width: 100px;
height: 100px;
border: 2px dashed red;

Answer 6

不同的浏览器渲染不一样，谷歌中默认为 inline-block。
据我开发中遇到的情况看，safari 和低端 IE 对其的解释存在兼容问题，一般是设置 padding 填充来撑开高度的。

Answer 7

猜测楼主用的是谷歌或火狐浏览器看的效果。谷歌或火狐浏览器中要设置input的高度，需要加两行代码：-webkit-box-sizing:border-box;-moz-box-sizing:boder-box;然后再写width:xxx;height:xxx才能起作用。