页面尺寸由和CSS共同控制，前者影响整体缩放逻辑，后者通过max-width、box-sizing等属性精确约束编辑区域；导出PDF需依赖@media print和@page规则，第三方库尺寸配置需结合初始化选项与容器样式。
页面尺寸由
HTML5 可视化编辑器（比如基于 contenteditable、Draft.js、Tiptap 或低代码平台）本身不直接“设置页面尺寸”，真正起效的是 HTML 的视口声明和容器样式。很多编辑器渲染区默认撑满父容器，若没显式约束，就容易在移动端缩放异常、PC 端内容溢出或打印错位。
关键点： 可视化编辑器里频繁插入图片、卡片、表格等带 padding/margin/border 的元素，若用默认 实操建议： 立即学习“前端免费学习笔记（深入）”； 可视化编辑器点击“导出 PDF”时，浏览器或后端服务（如 Puppeteer）依赖的是 CSS 媒体查询和分页控制，不是 HTML 的 解决路径： 这些库默认不暴露“页面尺寸”概念，但提供容器控制钩子。例如： 影响整个页面的缩放逻辑，而编辑区域（如
是移动端基础，但可视化编辑常需固定宽度（如 A4 打印尺寸），此时应设 width=960 或 width=794（px）等具体值max-width + margin: 0 auto 居中，避免全屏拉伸导致排版失控width 和 height 属性或内联 style 会覆盖内部 viewport 行为，需同步调整CSS 设置编辑区域尺寸时，
box-sizing: border-box 必须开启box-sizing: content-box，设置 width: 800px 后加上 20px padding 就实际占 840px，极易突破容器边界，拖拽错位、滚动条意外出现。
*, *::before, *::after { box-sizing: border-box; }
#editor）必须显式设 width: 100%; max-width: 800px;，而非仅 width: 800px，兼顾响应式回退body 或 html 直接设固定 width，会导致横向滚动条或截断，应限定在编辑内容容器内导出 PDF 或打印时，
@media print 和 size CSS 属性比 HTML 尺寸更关键。常见问题：A4 页面内容被压缩成半页、文字过小、跨页截断表格。
@media print { @page { size: A4; margin: 1cm; } } 显式声明纸张，注意部分浏览器（如 Firefox）要求 @page 必须在顶层 CSS 中，不能在 style 标签内动态注入page-break-inside: avoid; 防止标题和段落被拆到不同页vh/vw 单位——打印时它们无意义，应统一转为 px 或 cm（如 A4 宽 21cm ≈ 794px @96dpi）第三方可视化库（如 Quill、CKEditor 5）的尺寸配置藏在初始化选项里
bounds 选项限制滚动范围，用 theme: 'snow' 时需额外给 .ql-editor 设 min-height 和 max-height
config.height = '600px' 控制编辑器高度，但宽度仍由父容器决定；若要模拟文档纸张效果，得在外层套一个
