html placeholder 不支持 \n 或 html 标签，可用 unicode 行分隔符 u+2028 实现换行（chrome/firefox/edge/safari 15.4+），或用 js 赋值 ta.placeholder = '第一行\u2028第二行'；css 和伪元素方案无效。
textarea placeholder 里直接写 \n 不生效
HTML 标准规定 placeholder 属性值是纯文本，浏览器会忽略其中的 \n、
或 <br>，哪怕你在 HTML 源码里写成多行或用转义字符，最终都显示为单行空格合并后的文本。
用 Unicode 换行符 替代 \n
这是最轻量、无需 JS 的方案：在 placeholder 属性值中插入 Unicode 行分隔符
（U+2028 LINE SEPARATOR），多数现代浏览器（Chrome、Firefox、Edge、Safari 15.4+）能正确渲染为换行。
示例：
<textarea placeholder="第一行 第二行 第三行"></textarea>
注意点：
-
- 服务端模板（如 Jinja、EJS）需确保不自动 HTML 转义该字符
- Safari 15.3 及更早版本不支持，若需兼容可降级为单行提示
用 JavaScript 动态设置 placeholder（兼容性最强）
当必须支持老 Safari 或需要运行时控制换行内容时，改用 JS 设置 placeholder 属性值，并显式插入 \u2028（JS 中的 Unicode 转义）。
示例：
const ta = document.querySelector('textarea');<br>ta.placeholder = '用户名\u2028（必填，4–16 字符）';
关键细节：
- 不要用
ta.setAttribute('placeholder', ...)，它会把\u2028当普通字符串处理，可能失效 - 必须用点号赋值
ta.placeholder = ...，触发浏览器原生属性解析 - 若 placeholder 内容来自用户输入或 API，需提前将
\n替换为\u2028：str.replace(/\n/g, '\u2028')
别踩的坑：CSS 白空间和伪元素方案不推荐
有人尝试用 white-space: pre-line 或 ::placeholder 伪元素加 content，这些都不起作用：
-
white-space对placeholder文本本身无影响 -
::placeholder不支持content属性，也无法插入换行符 - 用绝对定位 + 多个
span模拟 placeholder，会破坏可访问性（AT 无法读取）、焦点管理复杂，且在 focus/blur 时易出错
真正需要多行 placeholder 的场景其实很少——用户第一次看到的是提示，真正输入时内容自然换行。如果业务强依赖多行说明，更稳妥的做法是把详细提示移到 label 或旁边 help text，而非塞进 placeholder。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
