input type="text" 无法实现真正多行输入，因其是单行内联替换元素，回车被拦截且换行符不渲染；textarea 才是规范的多行输入方案，其 rows/cols 仅为尺寸提示，换行符默认保留，placeholder 不支持原生换行需用 CSS 处理。
必须用 textarea，input type="text" 加任何属性或 CSS 都无法真正实现多行输入——这不是兼容性问题，是 HTML 规范层面的硬限制。
为什么 input type="text" 死活不能换行
浏览器会直接忽略你加在 input 上的 rows、cols，甚至 white-space、height、line-height 等 CSS 也无效。它本质是单行内联替换元素，回车键被拦截，\n 不会被渲染为换行，只会让光标跳到行尾或触发表单提交。你看到的“多行效果”，基本是 CSS 强行撑高 + 溢出滚动，内容仍是单行流，用户按 Enter 无反应，复制粘贴也丢格式。
textarea 的 rows 和 cols 到底怎么用
它们只是初始尺寸提示，不是约束：
-
rows="4"表示约显示 4 行文字高度，但真实高度受font-size、line-height、padding影响，移动端尤其容易失准 -
cols="50"按等宽字体估算宽度，实际输入超长行不会自动折行（除非开启wrap） - 用户仍可拖拽右下角缩放，除非用 CSS 写
resize: none - 更可靠的做法是用 CSS 控制：
height或min-height定高度，width或max-width定宽度
换行符怎么保留？提交时会不会丢 \n
用户手动按 Enter 输入的 \n 默认保留在 .value 中，但提交行为取决于 wrap 属性：
-
wrap="soft"（默认）：显示时自动软换行，提交值里只含用户按 Enter 插入的\n，超长行不截断 -
wrap="hard"：浏览器会在提交值中自动插入\r\n到软换行位置，适合邮件正文等格式敏感场景 -
wrap="off"：禁用软换行（横向滚动），但用户按 Enter 的\n依然存在并提交 - 服务端接收后，需统一处理
\r\n→\n，避免不同系统换行符不一致
placeholder 为啥不换行？怎么让它支持多行提示
placeholder 属性值里的 \n 在 HTML 解析阶段就被浏览器忽略，写成 完全无效。
- 最稳妥方案：别在
placeholder里塞换行，改用简洁单行文案，比如“请输入反馈（支持换行）” - 若真要视觉多行，必须靠 CSS：
textarea::placeholder { white-space: pre-line; } - 避免用 JS 动态注入多行 placeholder，会破坏原生可访问性语义，屏幕阅读器可能读不出
真正容易被忽略的是服务端处理——前端 maxlength 限制的是字符总数（含 \n），但后端校验若只按字节或未 normalize 换行符，就可能截断或报错；另外，富文本需求别硬改 textarea，该上 contenteditable 或第三方 RTE 就上。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
