📅 最后修改于: 2023-12-03 14:40:17.641000 🧑 作者: Mango
在前端开发中，textarea 元素通常用于文本输入和多行文本显示。默认情况下，浏览器会允许用户调整 textarea 元素的大小，但有时我们希望禁止用户调整该元素的尺寸。为了实现这一目标，我们可以使用 CSS 来控制 textarea 元素的大小调整行为。
textarea 元素的大小调整行为由 CSS 属性 resize 控制。该属性有以下取值：
none 表示不允许调整大小。both 表示允许在水平和垂直方向上调整大小（默认值）。horizontal 表示仅允许在水平方向上调整大小。vertical 表示仅允许在垂直方向上调整大小。initial 表示使用浏览器的默认行为。为了禁止用户调整 textarea 的大小，可以将 resize 属性设置为 none。示例代码如下：
textarea {
resize: none;
}
在上述代码中，我们选择所有的 textarea 元素并将 resize 属性设置为 none。这样一来，用户将无法通过拖拽边框来调整 textarea 的大小。
下面是一个完整的示例，展示如何禁止 textarea 元素调整大小：
<!DOCTYPE html>
<html>
<head>
<style>
textarea {
resize: none;
}
</style>
</head>
<body>
<textarea>Hello, world!</textarea>
</body>
</html>
在上述示例中，我们将 resize 属性应用于 textarea 元素来禁止其调整大小。
通过设置 textarea 元素的 resize 属性为 none，我们可以禁止用户调整其大小。这在某些情况下很有用，比如为了确保页面布局的稳定性或在应用程序中实现更好的用户体验。