-
用position:absolute+top:0+left:0+width/height:100%使图片叠于父容器左上角，父容器需设position:relative和明确高度，配合z-index与opacity切换，预加载图片并用object-fit:cover防变形。
-
不加async或defer的script标签会阻塞HTML解析：浏览器遇到时立即暂停解析，下载并执行脚本后才继续，导致白屏和DOM访问失败；内联与外链脚本均如此，且按文档顺序串行执行。
-
HTML不是编程语言而是语义化结构说明书，标签描述内容含义而非样式，应避免滥用无语义的<div>/<span>，注意属性写法规范（如width="200"而非"200px"，布尔属性无需赋值）。
-
前端缓存策略需平衡性能与一致性，核心包括：1.浏览器HTTP缓存（Cache-Control、ETag）和ServiceWorker实现网络资源缓存；2.内存缓存如函数记忆化与单例对象减少重复计算；3.本地存储（localStorage、IndexedDB）持久化数据并管理过期；4.结合时间戳、版本号或WebSocket实现实时更新机制，确保数据有效性。
-
matchMedia是浏览器原生API，用于监听媒体查询变化，支持响应视口尺寸、暗色模式、减少动画等环境变化，需注意实例复用、事件清理及SSR兼容。
-
最简方案是直接给body加background-attachment:fixed，但iOSSafari和部分安卓WebView不支持，且Chrome在body有transform等属性时也会禁用；推荐用body::before伪元素模拟fixed效果，需设position:fixed、z-index:-1、pointer-events:none，并确保background-size:cover和background-position:center。
-
主题切换不必强制用JavaScript控制:root，但主动切换主题必须依赖JS修改:root自定义属性以触发重绘；纯CSS仅支持有限响应，如系统暗色模式。
-
数组扁平化是将多维数组转为一维的过程，常用方法包括：1.使用flat()方法（ES2019），支持指定层数或Infinity彻底展开；2.递归结合reduce实现，兼容性好且灵活；3.toString后split仅适用于纯数字数组；4.扁平化同时去重可结合flat(Infinity)与Set。日常推荐优先使用flat()。
-
答案是：HTML文件可通过浏览器直接运行，只需保存为.html格式，用双击或拖拽方式在Chrome、Firefox等浏览器中打开即可；涉及AJAX或前端框架时需使用LiveServer或http-server启动本地服务器；注意资源路径正确以确保页面完整显示。
-
Jest更适合中大型长期维护项目，Vitest更适合新项目和Vite生态；两者均需正确配置以避免模块解析错误，可靠测试需覆盖边界、隔离副作用、验证行为而非实现细节。
-
Bootstrap基于HTML5语义结构运行，需以<!DOCTYPEhtml>开头、正确使用语义标签和栅格嵌套规则，否则响应式与组件功能将失效。
-
掌握Foundation需理解其四大核心：响应式12列网格系统通过.small-、.medium-、.large-类实现跨设备布局；模块化组件如.button、.top-bar封装常用UI元素；丰富的工具类如.show-for-small-only、.text-center提升样式调整效率；基于Sass的配置支持通过\_settings.scss自定义变量与断点，实现主题统一与性能优化。
-
表单标签与输入框对不齐的本质是默认样式差异和盒模型行为不一致，应采用“列对齐”思路，通过Grid或Flex布局统一结构并配合基础样式重置实现精准对齐。
-
正确设置transition属性可实现padding和margin的平滑过渡，需提前定义过渡属性如padding0.3sease，避免使用all以提升性能，且起始与结束值必须为具体数值（非auto），响应式中也需在各断点定义transition。
-
DOMParser无法直接解析孤立<tr>，因其必须嵌套在<table>、<thead>等合法父元素中；需通过createContextualFragment配合结构补全（如自动包裹<table>）实现安全解析。
