-
答案：可通过浏览器直接打开HTML文件预览效果，或使用VisualStudio开发服务器、LiveServer插件、Python命令行启动本地服务器运行。
-
HTML盒子水平垂直居中需依定位方式与兼容性选方案：一、绝对定位+transform（IE9+）；二、Flexbox（IE11+）；三、Grid（IE10+）；四、绝对定位+margin（仅固定尺寸，IE6+）；五、table-cell（IE8+）。
-
本文详解如何修复水平滚动容器（.info）阻断页面垂直滚动的问题，通过智能判断滚动方向与边界状态，确保用户既能左右滑动内容，又能正常上下滚动回到初始区域。
-
使用HTML5的video标签可实现网页视频播放，支持controls控制、多格式兼容（MP4/WebM/Ogg）、autoplay静音自动播放、loop循环及JavaScript动态控制播放状态，推荐preload="metadata"优化加载，避免移动端自动播放大文件以提升体验。
-
sticky元素需配合z-index解决遮挡问题，设置position:sticky和足够高的z-index值，并避免父容器overflow等属性干扰，确保其在层叠中处于顶层。
-
AJAX是使用XMLHttpRequest或fetchAPI实现异步通信的编程方式，核心是不阻塞JS执行；fetch基于Promise，推荐用于GET/POST请求，需注意状态码判断和响应解析；XMLHttpRequest兼容旧浏览器，需手动处理状态与数据解析。
-
:checked伪类结合+相邻兄弟选择器可实现基于复选框或单选按钮状态的视觉切换效果，如开关、手风琴菜单和内容显隐。其原理是:checked作用于选中的input[type="checkbox"]或input[type="radio"]，+选择紧跟其后的兄弟元素，从而控制样式显示。例如通过#toggle:checked+label+.content控制.content的display属性实现内容切换；在折叠面板中利用max-height和transition实现动画效果。关键点包括：目标元素必须为后续相邻
-
FetchAPI是现代浏览器中基于Promise的网络请求标准，语法简洁但需手动处理状态码、凭证、超时等；与XMLHttpRequest相比，它不自动解析响应、不发Cookie、无内置超时和进度监听，需显式配置credentials、headers并配合AbortController使用。
-
return会立即终止生成器函数的执行，返回指定值并设置done为true，后续next调用不再产生新值。
-
可通过HTML5与CSS定位、Grid、Flexbox、Canvas或Clip-path五种方法实现图片层叠：一用绝对定位加z-index；二用Grid的grid-area与order；三用Flexbox负边距与transform；四用Canvas按序drawImage；五用clip-path裁剪局部叠加。
-
核心是使用原生DOMAPI：优先用querySelector（支持CSS选择器）或getElementById（ID唯一时更快），注意判空；动态创建用createElement+appendChild防XSS；修改属性区分HTML属性与DOM属性，样式推荐classList或cssText；操作前确保DOM加载完成。
-
微前端通过沙箱机制、动态作用域绑定和资源隔离实现JS环境独立，避免全局污染；利用事件总线、共享状态、URL参数和浏览器原生能力实现应用间通信，确保协作灵活安全。
-
掌握正则高级技巧可高效处理文本，①用分组捕获提取年月日，②命名捕获提升可读性，③前瞻后顾精准匹配金额，④惰性匹配避免越界，⑤replace回调动态首字母大写。
-
CSSGrid列宽与盒模型冲突时，应使用minmax(0,1fr)替代1fr以忽略min-content限制，并为子项设置box-sizing:border-box和width:100%确保填满列宽。
-
hover提示框闪烁的主因是用display切换显隐导致重排，正确做法是保持DOM存在，用visibility+opacity配合transition，且transition声明在默认样式中。
