textarea嵌入表格单元格会塌缩成一条线，因默认inline-block与table-cell盒模型冲突、vertical-align:baseline导致贴底截断，且未设height/rows时scrollheight极小；须显式设置height:100%、min-height、vertical-align:top及white-space:pre-wrap等样式，并配合js动态调整高度。
直接往 <td> 里放 <code><textarea></textarea> 就能嵌入，但默认高度塌缩、边距错乱、换行失效——关键不是“能不能放”，而是“怎么放才不崩布局、不丢换行、不卡光标”。
textarea 嵌在表格单元格里为啥会塌成一条线？
浏览器对 <textarea></textarea> 的默认 display 是 inline-block，而 <td> 默认是 <code>table-cell，两者盒模型叠加后，vertical-align: baseline 会让它贴底对齐、内容被截断；更糟的是，没设 rows 或 CSS height 时，scrollHeight 返回值极小（常为 0 或 18px），导致视觉上“看不见”。
- 必须显式设置
style="height: 100%; min-height: 80px;"或至少rows="3" - 加
vertical-align: top到<td> 或 <code><textarea></textarea>，避免底部悬空 - 禁用
resize: none，否则表格列宽会被拖拽破坏 - 如果用了
box-sizing: border-box，height: 100%才真正撑满单元格；否则要手动加padding补偿 - 给
<textarea></textarea>加style="white-space: pre-wrap;"—— 这是唯一能同时保留换行、自动折行、不破坏布局的值 - 别用
white-space: pre，它不会自动折行，超宽内容会撑破表格列 - 后端接收时若用
innerText取值，\n会丢失；必须用.value - 提交前可做一次归一化：
textarea.value = textarea.value.replace(/\r\n/g, '\n')，尤其防 IE11 计算scrollHeight偏小 - input 事件第一句：
textarea.style.height = 'auto' - 第二句读取：
const height = Math.min(textarea.scrollHeight, 200)（200 是最大展开像素） - 第三句赋值：
textarea.style.height = height + 'px' - 移动端 iOS 要包一层
requestAnimationFrame，否则键盘收起后光标消失 - 别用
offsetHeight或clientHeight，它们返回当前渲染尺寸，内容溢出时就失真 -
name必须有，且全局唯一——后端靠它收数据，比如 PHP 的$_POST['note'] -
placeholder要简短，表格空间有限，写“请输入说明…”比“请在此处填写不少于50字的详细描述”更实际 - 如果表格带分页或动态增行，每个
<textarea></textarea>的name得带索引，如name="items[0].desc"，否则后端只能收到最后一个 - 用
<label></label>包裹<textarea></textarea>时，for属性必须匹配id，否则点击 label 不聚焦
表格里 textarea 换行显示不出来？
不是没换行，是 CSS 把换行符当空白吞了。HTML 渲染时，<textarea></textarea> 内部的 \n 会被当成普通空白处理，除非你告诉浏览器“这堆空格和换行得保留”。
怎么让 textarea 高度随内容自适应，又不撑开整行？
表格行高由最高单元格决定，scrollHeight 动态设高最稳，但直接赋值会触发重排+撑行——必须配合 height: auto 重置 + max-height 截断。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
name 和 placeholder 在表格里容易漏掉什么？
表格结构容易让人只顾对齐样式，忘了表单语义。没 name 提交后字段就为空；没 placeholder 用户不知道该填啥；而 id 缺失会导致 JS 绑定失败或 label 关联失效。
表格嵌 <textarea></textarea> 最难的不是写法，是控制它“只动自己、不动别人”：高度别拉扯整行，换行别跑出单元格，输入别触发整表重绘。这些细节全堆在 CSS 和 JS 的衔接点上，少一个 height: auto 重置，就可能让用户删两行字后还留着半屏空白。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
