我想禁用 textarea 的 resizable 属性。

目前，我可以通过单击 textarea 的右下角并拖动鼠标来调整 textarea 的大小。如何禁用此功能？

最佳答案

以下 CSS 规则禁用 textarea 的大小调整行为元素:

textarea {
  resize: none;
}

为某些(但不是全部)禁用它textarea s，有一个couple of options .

您可以使用 class标签中的属性(<textarea class="textarea1">):

.textarea1 {
  resize: none;
}

禁用特定的 textarea与 name属性设置为 foo (即 <textarea name="foo"></textarea> ):

textarea[name=foo] {
  resize: none;
}

或者，使用 id属性(即 <textarea id="foo"></textarea> ):

#foo {
  resize: none;
}

W3C page列出调整大小限制的可能值:无、两者、水平、垂直和继承:

textarea {
  resize: vertical; /* user can resize vertically, but width is fixed */
}

评论一个体面的compatibility page查看当前支持此功能的浏览器。正如 Jon Hulka 评论的那样，尺寸可以是 further restrained在 CSS 中使用 max-width、max-height、min-width 和 min-height。

Super important to know:

This property does nothing unless the overflow property is something other than visible, which is the default for most elements. So generally to use this, you'll have to set something like overflow: scroll;

Quote by Sara Cope, http://css-tricks.com/almanac/properties/r/resize/

https://stackoverflow.com/questions/5235142/