css的input框中满20个字自动换行

你可以使用CSS的`word-wrap`属性和`word-break`属性来实现输入框中的自动换行。

将`word-wrap`属性设置为`break-word`，可以使超出输入框宽度的单词自动换行到下一行。同时，将`word-break`属性设置为`normal`，可以保证单词内部不会被随意分割。

以下是一个示例CSS代码：

input[type="text"] {
  width: 200px;
  word-wrap: break-word;
  word-break: normal;
}

在这个示例中，我们将`input`元素的宽度设置为200像素，并设置了`word-wrap`和`word-break`属性，以确保输入框中的文本可以自动换行。

相关问题

input框怎么设置超过8个文字自动换行 并且高度自适应

在HTML和CSS中，你可以通过设置`white-space`属性和一些基本的CSS布局技术来实现在输入框超过8个字符自动换行，并且高度自适应的需求。以下是步骤：

1. 首先，给input元素添加一个class，例如`.autosize-input`。

<input type="text" class="autosize-input">

2. 使用CSS来设置样式。可以使用`white-space: pre-wrap`让文本可以换行，同时保留缩进；对于高度自适应，可以结合min-height和max-height以及软边距(`padding`)来控制：

.autosize-moz-pre-wrap; 对于老版本浏览器 */
  word-wrap: break-word;
  min-height: 40px; /* 设置最小高度，可根据实际需求调整 */
  max-height: none; /* 如果有最大高度限制，需要去掉这个限制 */
  resize: both; /* 允许用户调整输入框大小 */
  padding: 5px; /* 边距可以根据需要调整 */
}

这样，当输入的文字超过8个字符并达到容器宽度时，就会自动换行，而输入框的高度会随着内容增加而动态调整。

input用css进行文字自动换行

`input` 元素不支持自动换行，如果你需要让用户输入长文本并自动换行，可以使用 `textarea` 元素。

你可以通过 CSS 来控制 `textarea` 的样式，如设置文字大小、字体、颜色、边框等。同时，你可以使用 `resize` 属性来控制 `textarea` 是否可以调整大小。

以下是一个示例代码：

<style>
    textarea {
        font-size: 16px;
        font-family: Arial, sans-serif;
        color: #333;
        border: 1px solid #ccc;
        border-radius: 4px;
        resize: vertical; /* 只能调整高度 */
        width: 100%;
        height: 150px;
    }
</style>

<textarea placeholder="请输入多行文本"></textarea>

在这个示例中，`textarea` 元素被设置为可以自动换行，并且高度可以调整。同时，它的样式被通过 CSS 进行了控制。你可以根据自己的需要来进行调整。