-
JavaScript需要弱引用以避免内存泄漏，主要通过WeakMap和WeakSet实现；其键或元素为对象时，不阻止垃圾回收，适用于为对象关联元数据、缓存、标记等场景，但无法遍历、不能用原始值作键、值为强引用且回收时机不确定，故仅解决特定内存泄漏问题，非万能工具。
-
容器查询配合轻量状态机是当前最干净的微观自适应方案，需前置设置container-type、viewportmeta及使用@container语法，再通过ResizeObserver驱动状态机切换CSS类名实现精准响应。
-
优先用gap替代border实现等距网格，移除item边框改用outline或background+padding模拟；必须用border时，统一box-sizing:border-box并配合精确calc计算flex-basis。
-
应按用途语义化封装@mixin，如flex-row-center，而非通用参数化写法；需避免参数顺序错误、默认值干扰、意图不明确等问题，子项mixin须带-item-后缀，注意IE兼容与编译体积。
-
index.html无法直接连接数据库，必须通过后端服务中转；前端用fetch调用API，后端连接数据库并返回JSON；切勿硬编码数据库凭证，需处理CORS和安全防护。
-
object-fit是解决响应式图片拉伸/裁剪问题的核心方案，需配合object-position精准控制裁剪锚点，并通过background-image或JS降级兼容IE。
-
直接写.responsive-font()会编译失败，因为定义时若漏掉括号（如.responsive-font{...}）则不被视为Mixin，调用时.responsive-font()就报undefined；且调用必须带括号，参数类型须匹配，默认值确保空参可编译。
-
fixed导航栏遮挡锚点内容是因浏览器将目标元素顶部对齐视口顶部，而scroll-padding-top（设于html）可精准偏移滚动终点，仅影响滚动逻辑不破坏布局，Chrome89+/Firefox90+/Safari15.4+原生支持。
-
display:none是唯一真正移除渲染的方式，元素从渲染树中完全剔除、不占空间、不响应事件、JS查询尺寸为0，适合权限控制和条件渲染，但频繁切换会触发重排。
-
本文讲解如何使用CSS邻居选择器（+）配合语义化HTML结构，实现“仅显示直接父级被悬停元素所对应的提示信息”，彻底避免嵌套结构中因层级继承导致的多提示同时显示问题。
-
CSS颜色名称与十六进制、RGB值一一对应，如red为#FF0000或rgb(255,0,0)，共支持140多种标准色，可通过W3C规范或开发者工具查询，推荐使用十六进制以保证兼容性，RGB适用于透明度控制，HSL便于调整色彩属性。
-
移动端background-attachment:fixed失效需改用CSS3D方案：在页面容器设perspective，子页加transform-style:preserve-3d，各层用translateZ配合translateX实现视差，且滚动须由内部容器接管而非body。
-
加<divstyle="clear:both"></div>能显示父容器背景，是因为它强制撑开塌陷的父容器高度；真正有效需满足三条件：位置在浮动元素之后、display非inline/none、不可设visibility:hidden或display:none。
-
relative定位使元素相对于原位置偏移，仍占文档流空间，不影响其他元素布局；2.absolute定位使元素脱离文档流，不占空间，相对于最近的已定位祖先元素定位，常用于弹窗和精确布局。
-
滚动到视口才触发动画需用IntersectionObserver检测进入时机并动态增删类名控制，因CSS动画默认加载即播且无滚动感知能力，手动scroll监听易卡顿，重播需强制重排或清空animation属性。
