如何限制chrome中的max textarea宽度和高度或如何禁用textarea大小调整

时间:2011-08-26 12:25:14

标签: javascript html css google-chrome textarea

Chrome允许通过右下角的药物来调整文本区域的大小,但有时这种移动可能会破坏页面的设计,所以我想知道如何限制该操作的最大和最小宽度如何禁用功能完全在页面上thml/javascript/css

6 个答案:

答案 0 :(得分:20)

您也可以仅使用以下内容限制为水平调整大小:

resize: horizontal;

并且只能垂直调整大小:

resize: vertical; 

答案 1 :(得分:16)

您可以使用以下css禁用重新调整大小:

resize: none;

答案 2 :(得分:15)

这完全是CSS的问题。 要禁用调整大小(拖动滑块),只需使用resize: none;。要限制尺寸max(min)-widthheight应该可以解决问题。

答案 3 :(得分:14)

你可以使用:

resize: vertical; 
max-height: 200px;

答案 4 :(得分:1)

textarea.vertical {
  resize: vertical;
  max-height: 130px;
  min-height: 80px;
}

textarea.horizontal {
  resize: horizontal;
  max-width: 130px;
  min-width: 80px;
}
<p>Horizontally resizable textarea</p>
<textarea type="text" class="horizontal"></textarea>
<br>
<p>Vertically resizable textarea</p>
<textarea type="text" class="vertical"></textarea>

您可以将调整大小属性设置为水平和垂直或将其设置为默认值(用户可以双向拉伸)。

如果您要设置 resize: horizontal,则需要将附加属性添加为 max-width:200px;

如果您要设置 resize: vertical,则需要将附加属性添加为 max-height:200px;

答案 5 :(得分:0)

你可以使用

resize:none

限制textarea的大小调整。