textarea 的 wrap 属性仅影响原生表单提交时换行符的插入逻辑，对显示、JS 读取和 CSS 渲染无任何作用；视觉换行由 CSS 的 white-space、width 等控制，input 不支持多行，必须用 textarea 实现多行输入。
HTML 表单里没有“自动换行属性”这种东西——input 根本不支持多行，textarea 的 wrap 属性也不控制视觉换行，它只影响表单原生提交时的换行符插入逻辑，且现代应用基本用不到。
textarea 的 wrap 属性到底起什么作用？
wrap 是个被严重误解的属性。它只在两种条件下生效：一是表单用 method="post"（或 get）原生提交，二是后端按 application/x-www-form-urlencoded 解析数据。除此之外，它对显示、JS 读取、CSS 渲染全无影响。
-
wrap="soft"（默认值）：用户按 Enter 输入的\n会保留，超长行不会被截断，也不会插入额外换行符 -
wrap="hard"：仅当同时满足cols有明确数值 + 原生提交 + 后端未清洗时，才可能在.value中插入\r\n；实际中几乎失效，且插入位置非语义（比如把https切成ht和tps） - 没写
cols？那wrap="hard"直接被浏览器忽略
真正决定“看起来是否换行”的是 CSS
用户看到文字折行，不是因为 wrap，而是因为浏览器默认允许 textarea 按容器宽度视觉折行——前提是没被 CSS 禁掉。
- 检查是否误加了
white-space: nowrap或overflow: hidden，这会让内容横向溢出或滚动 - 确保父容器有明确宽度限制（如
width: 100%或固定值），否则textarea会无限撑宽 -
textarea默认行为等价于white-space: pre-wrap：保留用户输入的\n，同时支持自动折行 - 不需要额外写
overflow-wrap: break-word——它对textarea无效，Safari 尤其不响应
input type="text" 不可能自动换行
input 元素天生是单行控件，W3C 规范不允许它换行。所有试图用 wrap、rows 或 CSS 强行“模拟”多行的行为，都是错的。
立即学习“前端免费学习笔记（深入）”；
- 写
<input type="textarea">是无效 HTML，浏览器会降级为type="text" - CSS 设置
height+overflow-y: auto只能滚动，不能折行 - 想多行输入？必须用
<textarea>，这是唯一符合标准、可访问、可聚焦、可键盘导航的方案
最常被忽略的兼容性细节
移动端 Safari 对 textarea 的渲染逻辑和桌面不同：它更依赖原生行为，对 CSS 折行控制更弱；而 wrap="hard" 在 iOS 12–13 上完全不可靠，iOS 14.5+ 才稳定支持 overflow-wrap（但依然对 textarea 无效）。
真正可控的换行处理，只发生在 JS 层：读取 textarea.value 后，用正则归一化换行符（.replace(/\r\n/g, '\n')），再按需切分或渲染。别指望 HTML 属性替你做这件事。
