输入 type="number" 微调器未在 bootstrap 1.4 中显示答案

【问题标题】：Input type="number" spinners not showing with bootstrap 1.4输入 type="number" 微调器未在 bootstrap 1.4 中显示
【发布时间】：2012-03-27 06:27:42
【问题描述】：

我遇到了一个问题，在使用 bootstrap 1.4 时，我的 <input type="number"/> 元素中没有显示向上/向下微调器。微调器仍然存在：您可以单击它们来增加/减少数字，即使它们不可见。

我认为我已将其范围缩小到以下 CSS 声明。见http://jsfiddle.net/tKTRx/1/。

input, textarea {
  -webkit-transform-style: preserve-3d;
  …
}

这种样式有什么作用？有没有办法解决它？（在以后的bootstrap版本中似乎没有问题，但我还不能升级）。

【问题讨论】：

标签： html webkit twitter-bootstrap css-transforms

【解决方案1】：

这是一个已在 Chrome Canary 中修复的 webkit 错误。您可以在引导 github 页面上阅读更多关于该问题的信息：https://github.com/twitter/bootstrap/issues/630，但修复它的方法是添加样式：

input.flat, textarea.flat {
  -webkit-transform-style: flat !important;
}

然后当你有一个输入/文本区域时添加类flat。

【讨论】：

【解决方案2】：

假设您实际上没有进行任何 3D 变换，该属性的原因是让浏览器对 CSS 过渡、变换和动画使用硬件加速渲染。如果您没有进行任何 3D 变换，那么可以安全地移除它，这可能会影响 iOS 设备上 2D 变换的性能。

【讨论】：