-
本文详解如何通过position:absolute与z-index组合，让点击<summary>展开的<details>内容层叠于其他卡片之上，解决默认流式布局中内容撑开、遮挡错位的问题。
-
HTML5推荐用iframe嵌入外部网页，video/audio原生标签嵌入音视频，object仅作遗留资源备用；iframe需注意跨域与沙箱安全，video/audio支持多格式、字幕、自动播放（需静音），object依赖插件且兼容性差。
-
flex-direction在媒体查询中不生效的根本原因是父容器未启用Flex布局，需检查display是否被覆盖为block或grid；响应式应优先用min-width而非onlyscreen；column-reverse慎用于语义区域，推荐order属性；子项尺寸建议用flex-basis替代width。
-
WebSocket通过全双工通信实现低延迟交互，适用于聊天室等实时场景。使用JavaScript创建实例并监听onopen、onmessage等事件进行连接管理，通过JSON传输结构化数据，结合自动重连机制应对网络中断，生产环境应采用wss加密、频率限制和输入转义等安全措施，确保稳定高效通信。
-
自定义checkbox样式的核心是隐藏原生控件（推荐opacity:0+position:absolute），用关联的label或伪元素模拟视觉状态，并通过:checked伪类控制选中样式，同时保障可访问性与交互反馈。
-
解构赋值是JavaScript原生支持的数据提取机制，按结构从数组或对象中取值：数组按索引位置匹配，支持跳过、剩余元素收集和默认值（仅undefined生效）；对象按属性名匹配，支持重命名、嵌套解构、默认值及防崩兜底。
-
Sass颜色函数如darken()和lighten()基于HSL动态调整亮度，需避免多层嵌套调用；自定义px-to-rem()函数可统一响应式缩放，提升可维护性。
-
JavaScript通过事件循环处理异步操作，宏任务（如setTimeout、script整体代码）与微任务（如Promise.then、queueMicrotask）分属不同队列。每次事件循环先执行一个宏任务，随后清空所有当前微任务，微任务具有更高优先级。例如，同步代码执行后，微任务回调（如Promise.then）会在当前宏任务结束后立即执行，而setTimeout等宏任务需等待下一轮循环。嵌套场景中，宏任务产生的微任务会在该宏任务结束后立即执行，导致输出顺序可能不符合直觉。由于微任务持续占用主线程，
-
直接用repeat(7,1fr)正确，但需前置补全当月1号前的空格（根据getDay()计算），确保日期对齐星期；格子高度推荐minmax(40px,auto)，避免min-content/max-content兼容性问题；多月切换用display:none而非opacity或grid-area定位；响应式不改列数，只调字体、间隙与容器宽；空格子须处理无障碍（aria-hidden、键盘跳过）。
-
JavaScript可通过MediaRecorderAPI配合getDisplayMedia()实现浏览器内屏幕录制，需用户授权且仅限HTTPS或localhost安全上下文，须在用户手势触发下调用，支持Chrome、Edge、Firefox，Safari暂不支持。
-
align-items用于控制Flexbox子元素在交叉轴的对齐方式，transition则用于实现属性的动画过渡；由于align-items的取值为关键词而非连续数值，无法直接触发过渡动画。例如将align-items从flex-start变为center时，样式会立即切换而无动画效果。要实现类似“对齐动画”的视觉效果，应改用支持过渡的属性进行模拟，如transform:translateY()、margin或top/bottom等可插值属性。通过结合:hover状态或JavaScript类切换，配合t
-
HTML不是编程语言，其规范性关乎渲染、SEO与可维护性；lang属性必须设于<html>标签且符合BCP47标准，charset需置于<head>最前，容器元素应显式闭合，data-属性用于业务数据而非class，细节决定工程质量。
-
Grid子项选择器必须作用于直接子元素；:nth-child按DOM顺序匹配，与视觉位置无关；属性选择器[grid-area="name"]可精准定位命名区域子项；hover应避免触发重排。
-
iOSSafari及WKWebView默认禁止有声视频自动播放，必须同时满足muted、playsinline和用户手势触发（或配置mediaTypesRequiringUserActionForPlayback）三条件；视频还须无音频轨、含关键帧且用H.264编码。
-
HTML5媒体暂停可通过五种方法实现：一、调用pause()方法；二、绑定按钮点击事件；三、监听play事件自动暂停其他媒体；四、启用controls原生控件；五、监听pause事件同步状态。
