jQuery Mobile 和 textarea 行

【问题标题】：jQuery Mobile and textarea rowsjQuery Mobile 和 textarea 行
【发布时间】：2012-04-01 06:48:27
【问题描述】：

所以，我想在 1 行上显示 textarea。

但 jQuery Mobile 不这么认为...无论我在 rows 属性中设置什么值，它始终是 2 行高度...

有什么解决办法吗？

【问题讨论】：

标签： jquery css jquery-mobile textarea rows

【解决方案1】：

jQuery Mobile CSS 为textarea 元素设置了一个特定的高度：

textarea.ui-input-text {
    height : 50px;

    -webkit-transition : height 200ms linear;
       -moz-transition : height 200ms linear;
         -o-transition : height 200ms linear;
            transition : height 200ms linear;
}

您可以创建自己的规则来将此高度覆盖为更单行的内容：

.ui-page .ui-content .ui-input-text {
    height : 25px;
}

演示：http://jsfiddle.net/mEs8U/

【讨论】：

【解决方案2】：

您还可以使用 max-height 将自动增长限制设置为 textarea。

textarea.ui-input-text {
    max-height : 100px;
}

【讨论】：