-
浮动元素外边距折叠导致间距异常，因脱离文档流使margin计算失效；应避免直接设margin，改用padding、BFC包裹或Flex/Grid布局，配合gap属性和box-sizing统一控制。
-
align-items只作用于Flex容器的直接子元素（flexitem），控制其在交叉轴上的对齐方式；默认flex-row时交叉轴为垂直方向，flex-col时为水平方向，需确保父容器为flex且具有明确高度。
-
:focus-visible比:focus更合适，因为它仅在真实键盘导航时激活蓝框，避免鼠标点击等场景的干扰，保障键盘用户定位当前焦点。生效需两个前提：禁用全局outline重置且显式声明outline样式；还需兼顾Safari兼容性、暗色模式及高对比度适配。
-
Bootstrap5明确放弃IE（含IE11）支持，因其缺失CSS自定义属性、标准flex/grid、IntersectionObserver等核心能力，且无可靠polyfill可补全，官方自Alpha版起已移除所有兼容逻辑。
-
容器查询必须显式声明container-type（如inline-size）才能生效，否则@container规则静默失效；条件语法需用width>=400px等函数形式，不支持min-width等声明式写法。
-
必须给父容器加position:relative，因为absolute元素会以最近的已定位（relative/absolute/fixed/sticky）祖先为参考点；若父容器为默认static，则向上回溯至body或意外容器，导致定位错位。
-
本文介绍一种基于Tampermonkey的轻量级解决方案，通过JavaScript自动提取<a>标签中的data-url值并写入href属性，使原本禁用中键点击的链接恢复「Ctrl+左键」或鼠标中键在新标签页打开的功能。
-
本文介绍在聊天机器人界面中为多个动态生成的消息气泡添加独立可追踪的点赞/点踩按钮，通过data属性替代ID索引实现精准事件识别与状态管理，确保每次评分能准确关联到对应消息并持久化至数据库。
-
IE9–IE11原生不识别HTML5语义标签，需用html5shiv通过document.createElement注册标签并配合CSS显式设display:block；IE8及以下会忽略标签仅保留文本；IE10+虽支持标签但Flex/Grid兼容性差，须加前缀或降级处理。
-
推荐用data-level属性配合CSS伪元素生成星级标识，如.difficulty[data-level="2"]::before{content:"★★";color:#4a90e2;}，兼顾轻量、可维护与语义化。
-
用data-i18n标记元素+JSON语言包管理多语言文本，解耦翻译与结构；优先textContent更新文字，避免innerHTML导致事件丢失；切换时局部刷新并同步更新document.documentElement.lang及Intl格式化实例。
-
loadAnimation基本调用正确，但默认不自动播放需显式设autoplay:true；容器必须存在且具宽高，path与animationData二选一，renderer默认svg，JSON须由Bodymovin5.7+导出。
-
“模块聚合器”模式通过中心化节点统一治理异步依赖加载时序，基于DAG建模依赖关系，分预热、并发、串行、聚合四阶段调度，并集成可观测、熔断、灰度等能力。
-
可用的下拉框需用<selectname="xxx">包裹多个<optionvalue="val">文本</option>，name确保提交字段，value指定提交值，selected设默认项，disabled可禁用整体或单选项。
-
Intl.DateTimeFormat的locale参数需传入符合BCP47标准的完整语言区域标识（如"zh-CN"、"en-US"）才生效；传"zh"或"en"可能降级至默认行为，推荐使用navigator.language获取的值或显式指定带地区后缀的locale。
