原生alert()无法全屏是浏览器规范限制，必须用自定义modal实现：通过fixed定位+vw/vh覆盖视口、z-index遮罩、flex居中内容，并处理移动端缩放、滚动锁定、焦点管理及可访问性。
HTML原生alert()无法全屏，这是浏览器硬性限制
直接调用 alert() 时，浏览器会强制使用系统级模态对话框，尺寸、位置、样式完全不可控——无论你加多少CSS或JS，它都不会铺满屏幕。这不是代码写错了，是规范层面的禁令：W3C明确要求 alert() 必须由用户代理（即浏览器）自主渲染，禁止网页干预。
用自定义modal替代alert()才能真正全屏
要实现视觉上“铺满屏幕”的警告效果，必须放弃原生 alert()，改用HTML+CSS+JS构建的自定义弹窗。关键在于两步：覆盖整个视口 + 阻断底层交互。
- 用
position: fixed+top: 0; left: 0; width: 100vw; height: 100vh;确保遮罩层撑满屏幕（注意用vw/vh而非%，避免滚动条导致缩放） - 给遮罩层设
z-index高于页面所有元素（如9999），并加pointer-events: none;到body上（或直接在遮罩层内嵌内容） - 内容区居中推荐用
display: flex; justify-content: center; align-items: center;，比绝对定位更鲁棒
<div id="fullscreen-alert" style="position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,0.8);z-index:9999;display:flex;justify-content:center;align-items:center;">
<div style="background:#fff;padding:24px;border-radius:8px;text-align:center;">
<p>操作失败，请重试</p>
<button onclick="closeAlert()">确定</button>
</div>
</div>
移动端全屏需额外处理滚动和缩放
在iOS Safari或安卓Chrome里，单纯设 100vh 可能被地址栏/导航栏挤压，导致遮罩层露白边；用户双指缩放还会让弹窗错位。
Convert Markdown To HTML And PDF - Markdown和HTML、PDF互转
下载
实现 Markdown↔ HTML 互转，支持导出 PDF，用于用户请求的文档格式转换。
立即学习“前端免费学习笔记（深入）”；
- 用
height: 100%+min-height: 100vh组合兜底 - 弹出时立即执行
document.body.style.overflow = 'hidden';锁定滚动 - 禁止缩放：在
中确保有<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">，否则双击可能触发缩放
别忽略焦点管理与可访问性
全屏弹窗不是“视觉满屏”就够了。键盘用户按Tab时焦点若跑出弹窗，或屏幕阅读器无法识别提示内容，就等于没真正生效。
- 弹窗显示后，用
focus()主动聚焦到第一个可交互元素（如确认按钮） - 给遮罩层加
role="dialog"和aria-modal="true"，让辅助技术感知模态状态 - 按Esc键关闭弹窗是基本预期，记得监听
keydown事件捕获Escape
真正难的不是铺满屏幕，而是让这个“满屏”对所有设备、所有交互方式都成立——尤其是当用户关掉JavaScript或用键盘导航时，那层遮罩是否还起作用，往往被忽略。
