-
align-items控制网格项在单元格内垂直对齐，justify-items控制水平对齐；二者生效需列/行有明确尺寸；align-content/justify-content仅在轨道总和小于容器时分配多余空间；align-self/justify-self可覆盖容器设置但有兼容性限制。
-
断点应基于真实设备分布和内容容器需求选择，优先用min-width实现移动优先渐进增强，通过DevTools观察内容挤压宽度确定具体值，避免硬套设备分类或过时数值，注意JS与CSS媒体查询同步问题。
-
JavaScript性能优化的核心是减少主线程阻塞、降低内存开销、避免重复计算和无效渲染；需缓存DOM引用、用DocumentFragment批量操作、及时清理闭包引用、将耗时计算移至WebWorker。
-
直接写@media(prefers-color-scheme:dark)即可生效，但需确保CSS作用于真实渲染元素、无内联样式覆盖、无更高优先级规则锁定，且兼容Chrome76+、Firefox67+、Safari12.1+。
-
搜索建议框缩放时消失或错位，是因为absolute定位基准依赖最近的relative祖先，而父容器未设position:relative、宽度计算不匹配（如仅用width:100%）、未处理padding/border及box-sizing等因素导致定位偏移和溢出。
-
ServiceWorker通过拦截网络请求实现离线访问，首先注册sw.js文件，在install事件中缓存静态资源，activate时清理旧缓存，fetch事件中优先返回缓存响应并动态缓存新资源，通过版本号更新缓存并使用skipWaiting和clients.claim实现快速激活。
-
gap在图片画廊中不起作用是因为它仅对Flex和Grid容器生效，若父容器未设display:flex或display:grid，则gap无效；推荐用grid-template-columns:repeat(auto-fit,minmax(280px,1fr)))配合gap实现自适应响应式布局。
-
本文详解在HTML文档完全解析后执行外部JS文件的两种主流方案：函数参数传递与全局变量初始化，兼顾代码可维护性与作用域安全性，并提供可直接运行的示例与最佳实践建议。
-
PyCharm通过调用系统默认浏览器预览HTML文件。1.确保已安装并设置默认浏览器；2.在PyCharm中右键HTML文件选择OpeninBrowser即可在浏览器中查看；3.可在Settings中设置默认浏览器优先级；4.使用顶部工具栏地球图标或快捷键Ctrl+Shift+A快速打开，适合静态页面开发调试。
-
JavaScript本身不能直接实现AR，但可通过WebAR框架（如AR.js/A-Frame或WebXRAPI）在浏览器中叠加虚拟物体；AR.js+A-Frame适合图像识别轻量方案，WebXR支持无Marker平面检测与命中测试，需Three.js渲染，受限于设备、浏览器及HTTPS环境。
-
JavaScript中函数式编程指避免共享状态、不修改输入、用纯函数组合逻辑、显式串联数据流；需用扩展运算符替代push/赋值，用pipe/compose表达转换链，并将副作用显式隔离。
-
必须设置box-sizing:border-box;否则border会使元素总宽超出设定值；border需同时指定宽度、样式（如solid）、颜色三部分；单边边框优先用border-bottom等方向属性；内边距和行高需同步调整以保证对齐。
-
nextTick优先级高于setImmediate；nextTick在当前操作完成后立即执行，属最高优先级微任务，而setImmediate在事件循环check阶段执行，需等待当前阶段结束。
-
HTML函数开发本身不耗电，真正决定电源需求的是开发设备整机功耗；纯前端开发约80W–250W，加后端/容器/调试可达300W+，建议按(CPU_PL2+GPU_TGP)×1.2+60W并向上取整选电源。
-
用min-height配合Flex布局是最稳妥解法：设html/body为height:100%，body为display:flex;flex-direction:column;，主体内容flex:1，footer自然吸底。
