当文本字段集中在我的Sencha Touch App时,这就是我遇到的问题

由于某种原因,文本字段似乎垂直和水平居中.

这是它应该看起来的样子

有没有人已经有同样的问题并解决了它？

更新

它不会一直发生,但确实发生在最初不是水平居中的任何文本字段上.

有时也会在Android上发生(Chrome 26)

最佳答案 我相信你所看到的是(至少从截图中)iOS输入框上的Safari自动缩放功能.当获得输入焦点时,该“现象”自动使输入框居中/聚焦.

这个< meta />标签有助于防止：

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

这是什么< meta />上面的标签完成是：

>在设备的屏幕宽度上渲染页面;
>将缩放级别设置为1：1;
>并将最大比例固定为1(基本上不可扩展).

如果您的页面明确针对移动设备进行了优化,那么上述解决方案应该可以正常工作.

或者,如果您想控制哪个< input />控制这种情况发生,使用：

<meta name="viewport" content="width=device-width" />

然后,将每个< input />的字体大小样式设置为至少16个像素.

<input type="text" style="font-size: 16px;" />

这更紧凑< meta />标签只是说页面最初应以1：1的比例显示.

这是一个test page(缩写：http://bit.ly/15GbxJa),将展示你(希望)想要解决的问题.该测试页面使用第二种(替代)方法进行更细粒度的控制;您可以查看源代码以供参考.

初始页面显示：

分别有和没有自动缩放：