-
Flex布局中，justify-content和align-items控制主轴与交叉轴对齐，实现整体居中或分布；当需精确定位特定元素时，可结合position:relative或absolute进行局部调整。例如，flex居中容器内元素可通过relative上移10px，或在relative定位的父容器中使用absolute将角标固定于右上角。注意避免滥用absolute以免破坏流式布局，确保父容器尺寸明确，合理使用z-index控制层叠。两者协同可实现灵活精准的界面布局。
-
:nth-child(odd)和:nth-child(even)可直接实现列表隔行变色，但需确保父元素下仅含<li>标签；若混杂其他节点，应改用li:nth-of-type(odd/even)以精准匹配<li>元素，避免序号偏移。
-
前端性能监控需采集FP、FMP、LCP、FID、CLS等核心指标，结合JavaScript错误捕获与自定义行为标记，通过PerformanceAPI和事件监听实现；利用sendBeacon懒加载上报，采样非关键数据，持续优化采集与上报策略以提升用户体验。
-
JavaScript测试是保障代码稳定的底线，Jest需正确配置文件名、脚本及ES模块支持；纯函数测试须覆盖边界条件；异步/API依赖须mock，DOM操作需jsdom或mock。
-
CSS选择器是选中HTML元素并应用样式的桥梁，包括基础选择器（如标签、类、ID、通配符）和高级选择器（如后代、子元素、兄弟、属性、伪类、伪元素），掌握它们可提升样式代码的灵活性与可维护性。
-
JavaScript作用域在代码编写时即确定，取决于变量声明位置和方式：全局变量声明于函数外，局部变量声明于函数内或块级作用域（let/const），var无块级作用域，易导致意外提升。
-
运行HTML文件只需将其保存为.html格式并用浏览器打开。1.确保文件以.html为扩展名，避免保存为.txt格式；2.双击文件或右键选择浏览器打开，也可在浏览器地址栏输入file:///加文件路径；3.使用VSCode等编辑器可安装LiveServer插件实现自动刷新预览；4.通过右键检查元素和查看控制台调试页面显示问题，确认资源路径正确即可正常运行。
-
ShadowDOM通过隔离DOM子树实现样式封装，内部样式不泄露、外部样式不穿透；推荐内联<style>，慎用!important和全局选择器，善用:host、::slotted和CSS自定义属性实现可控定制。
-
JavaScript中设置Cookie需通过document.cookie="key=value;expires=...;path=/;domain=..."字符串赋值，必须显式指定expires/max-age、path和domain才能正确覆盖或删除；读取需正则解析并decodeURIComponent；删除本质是写入过期同名Cookie，且path/domain必须严格匹配原值。
-
JavaScript动态效果核心在于DOM状态精准控制与事件节奏把握，需避免内联事件、重复绑定、class覆盖、setTimeout模拟帧率、innerHTMLXSS风险，并重视交互中断时的状态回退。
-
本文详解如何解决CSS指纹扫描动画中背景图随元素尺寸变化而偏移的问题，通过固定background-position值替代center，确保扫描光效始终精准对齐指纹区域。
-
属性值完全匹配需用引号包裹，如[data-status="active"]；忽略大小写加i标志，如[lang="en"i]；布尔属性仅用[attr]形式；动态更新须用setAttribute而非dataset。
-
本文介绍一种基于SVG的终端式文本渲染方案，通过viewBox和preserveAspectRatio实现字符网格的全屏自适应缩放，确保字体在任意屏幕尺寸下自动最大化且不拉伸变形。
-
链表和树可通过对象与引用实现；链表用于高效插入删除，树适用于查找与层级结构，JavaScript中二者均需手动构建节点与操作方法。
-
直接用标签名或ID写CSS难维护，因语义弱、唯一性强、结构耦合高；应采用BEM类名规范与独立顶层类名HTML结构，实现样式解耦与真正复用。
