防止 textarea 调整 CSS 大小

当使用 textarea 标签时，我们有时希望它的大小固定不变，而不是随着输入内容的改变而调整大小。在这种情况下，我们需要使用 CSS 来防止 textarea 调整大小。

方法一：使用 resize 属性

resize 属性是一个 CSS3 属性，它用于控制元素的大小可调整性。当设置为 none 时，元素的大小将无法调整。

textarea {
  resize: none;
}

方法二：使用 max-height 和 min-height 属性

使用 max-height 和 min-height 属性也可以达到固定 textarea 大小的目的。我们设置 max-height 和 min-height 等于 textarea 的高度，并且将 overflow 属性设置为 auto，这将在 textarea 内容超出高度时显示滚动条。

textarea {
  max-height: 200px;
  min-height: 100px;
  overflow: auto;
}

方法三：使用 height 属性

如果我们明确知道 textarea 的高度，并希望它始终保持不变，可以使用 height 属性。

textarea {
  height: 150px;
}

总结

以上三种方法都可以防止 textarea 调整大小，具体应该使用哪种方法取决于具体场景。在实际开发中，我们可以根据需要选用合适的方法来固定 textarea 大小。

返回代码片段：

## 方法一：使用 resize 属性

resize 属性是一个 CSS3 属性，它用于控制元素的大小可调整性。当设置为 none 时，元素的大小将无法调整。

```css
textarea {
  resize: none;
}

方法二：使用 max-height 和 min-height 属性

使用 max-height 和 min-height 属性也可以达到固定 textarea 大小的目的。我们设置 max-height 和 min-height 等于 textarea 的高度，并且将 overflow 属性设置为 auto，这将在 textarea 内容超出高度时显示滚动条。

textarea {
  max-height: 200px;
  min-height: 100px;
  overflow: auto;
}

方法三：使用 height 属性

如果我们明确知道 textarea 的高度，并希望它始终保持不变，可以使用 height 属性。

textarea {
  height: 150px;
}