css中textarea换行显示

CSS中的textarea元素是用于创建多行文本输入框的标签。在默认情况下，当用户输入的文本超过文本框的宽度时，文本会自动换行到下一行。有时我们希望限制文本框的高度，当文本超过指定的高度时，出现滚动条而不是自动换行。那么，如何实现textarea的换行显示呢？

在CSS中，我们可以使用属性`overflow`来控制元素内容溢出时的处理方式。通过设置`overflow: auto`，我们可以让textarea元素在内容溢出时出现滚动条。这样设置后，即使文本没有超过文本框的宽度，也会出现水平滚动条。为了解决这个问题，我们可以使用`overflow-x`和`overflow-y`属性分别控制水平和垂直方向的溢出处理。

示例代码如下所示：

textarea {
  width: 300px;
  height: 100px;
  overflow-x: hidden;
  overflow-y: auto;
}

在上面的示例中，我们设置了textarea元素的宽度为300px，高度为100px。通过`overflow-x: hidden`，我们隐藏了水平方向的滚动条。而通过`overflow-y: auto`，我们让垂直方向的滚动条在内容溢出时自动出现。

除了使用`overflow`属性，我们还可以使用`resize`属性来控制textarea元素的大小是否可调整。默认情况下，textarea元素是可以通过拖拽边框来调整大小的。如果我们希望禁止用户调整大小，可以将`resize`属性设置为`none`。

示例代码如下所示：

textarea {
  width: 300px;
  height: 100px;
  overflow: auto;
  resize: none;
}

在上面的示例中，我们通过`resize: none`禁止了用户调整textarea元素的大小。

需要注意的是，以上示例代码中的宽度和高度只是示意，你可以根据实际需求进行调整。

总结一下，通过设置`overflow`和`resize`属性，我们可以控制textarea元素的换行显示和大小调整。这些属性在实际开发中非常有用，可以帮助我们更好地控制文本框的外观和交互效果。