-
blockquote必须闭合，否则浏览器自动修复会导致布局错乱、footer消失、cite失效及屏幕阅读器朗读异常；cite属性须为完整URL，专标来源而非作者；footer与cite是语义闭环必备，须正确嵌套并适配深色模式样式。
-
relative定位不改变元素在文档流中的位置，但会为absolute子元素创建新的定位上下文；即使无偏移，设为relative的父元素也会成为子元素定位参照物；子元素的top、left等属性将相对于该父元素计算，而非继续向上查找；若无定位祖先，则默认相对于视口定位；relative元素仍占据原空间，布局不受影响；常用于弹窗、下拉菜单、卡片按钮、轮播图箭头等需要局部精确定位的场景；其核心作用是静默建立坐标系，实现子元素自由定位且不破坏整体布局。
-
track元素kind属性仅有5个合法值：“subtitles”“captions”“descriptions”“chapters”“metadata”；其他值被忽略或降为“metadata”；各值用途、渲染行为及兼容性要求均不同，且需满足HTML结构、属性和响应头等前提条件才能生效。
-
视频课程页面需同时解决播放控制、目录跳转、响应式布局、移动端静音拦截四件事；video必须加muted+autoplay+playsinline（含webkit前缀），双source兜底，preload="metadata"，目录跳转须currentTime+play()显式触发并捕获错误，卡片用grid+aspect-ratio，禁用页面滚动改用容器滚动，错误时回退poster图，跳转逻辑与播放状态须解耦。
-
浮动与定位的核心区别在于对文档流的影响及使用场景。①浮动（float）使元素半脱离文档流，仍影响相邻内容，常用于文本环绕和简单布局，但需清除浮动以解决高度塌陷问题；②定位（position）则让元素完全脱离文档流（如absolute、fixed），实现精确位置控制和层叠效果，适用于弹窗、固定导航等场景；③两者关系在于均用于改变元素位置，但浮动侧重排版，定位侧重精准放置；④在响应式设计中，浮动因复杂布局和顺序控制的局限逐渐被Flexbox和Grid取代，而定位因其固定、叠加和粘性能力仍不可或缺；⑤层叠上下文
-
Map和Set通过树形（如TreeMap，O(logn)）或哈希（如HashMap，平均O(1)）实现，将查找、插入、删除从O(n)优化为稳定高效，适用于动态频繁操作场景。
-
本文详解如何将HTML中<script>标签内的JavaScript逻辑提取为外部.js文件，并确保功能正常运行，涵盖文件创建、HTML引入方式、执行时机控制及常见错误规避。
-
状态模式通过封装对象状态及其行为，使对象在内部状态改变时改变其行为，避免复杂条件判断。上下文（如Light）持有当前状态，并将状态相关操作委托给具体状态对象处理；具体状态（如OnState、OffState）实现各自行为逻辑并可切换状态。示例中灯的开关通过press方法触发不同行为，无需if/else判断。优点包括消除条件逻辑、提升扩展性与职责清晰，适用于多状态场景如订单流程、按钮状态、游戏角色动作等，增强代码可维护性与灵活性。
-
用dataset属性标记本地修改但未同步的DOM元素，需用JSON.stringify序列化原始值存入data-original，编辑时同步当前值到data-current并比对，配合localStorage存最小patch实现离线冲突识别。
-
Generator自动执行器不解决分布式“分布”问题，但通过线性化、可中断恢复的控制流，封装请求意图并由执行器统一注入服务发现、重试、熔断、traceId透传等横切逻辑。
-
:first-child伪类选择父元素中第一个子元素，且该子元素需匹配指定选择器。例如p:first-child选中作为首个子元素的p标签；若首个子元素为其他类型（如h2），则p:first-child不生效，此时可用p:first-of-type选中首个p类型元素。样式应用需注意子元素实际顺序，:first-child基于位置而非类型，结合:first-of-type更灵活可靠。
-
使用BEM命名、控制特异性、CSS模块化和合理加载顺序可避免样式冲突。通过block__element--modifier命名隔离组件，统一类选择器避免!important，利用CSSModules或Scoped封装作用域，先载入通用样式再组件最后主题，确保团队规范一致，提升维护性与可控性。
-
单选按钮必须用相同name属性分组，value应为简洁标识符，label负责显示文案，checked用于默认选中，且需保障无障碍支持。
-
Bootstrap嵌套列出现空白是因外层.col的padding与内层.row的margin抵消不净，需在嵌套.row上加mx-n3（BS5）或mx-n2（BS4）负边距类解决。
-
选框架前需明确项目功能需求，小页面或已有设计系统时无需完整CSS框架；Bootstrap提供预设组件和JS交互，Tailwind是原子类工具集，二者适用场景不同。
