-
响应式表格小屏转卡片需语义打散并用flex重排，关键在为td添加data-label属性并通过媒体查询控制display值，保留表格结构以保障可访问性与SEO。
-
scoped样式失效的根本原因是data-v-xxxx属性未正确注入或CSS选择器未匹配该属性；需同时满足模板元素带该属性且编译后选择器末尾含[data-v-xxxx]。
-
Chrome任务管理器是定位多标签页内存异常最直接的工具，按Shift+Esc一键呼出，点击“内存”列排序后重点关注“类型”为“标签页”且占用超400MB的进程，同时筛查扩展程序与后台页面，并可通过chrome://flags启用悬停内存提示实现免开窗监控。
-
CSSTransition通过设置transition-property、duration、timing-function和delay实现元素样式平滑变化，如按钮悬停变色；可由:hover、:focus或JavaScript操作类名触发，常用于无需JS的基础动画，需注意属性值明确且避免使用不支持过渡的属性。
-
fixed定位失效主因是父元素设置了transform、filter、opacity<1等属性，导致创建新包含块使fixed退化为absolute；需逐层检查computed值，移除或重置相关样式验证。
-
CSS框架对齐更可靠，因其封装了box-sizing、gap兼容性及单位换算，避免手写margin/padding在不同浏览器和布局嵌套中的不一致；需确保容器启用对应布局模式（如flex/grid），否则对齐类无效。
-
使用@keyframes统一box-shadow和border-color动画关键帧，结合will-change或translateZ启用硬件加速，通过CSS变量保持颜色一致性，并注意浏览器兼容性与prefers-reduced-motion适配，可解决闪烁、卡顿等问题，确保动画流畅同步。
-
showSaveFilePicker需在HTTPS或localhost安全上下文中运行，否则静默失败或抛SecurityError；用户取消时Promise会reject而非返回null，须用catch捕获；types是类型建议而非过滤器，suggestedName需显式匹配内容类型后缀；批量保存应打包为ZIP单次调用；iOSSafari不支持，需降级为download链接。
-
答案：HTML5分页依赖语义化结构与JS逻辑结合，通过nav包裹分页导航，data-page标识页码，JS计算总页数并动态生成按钮，支持客户端或服务端分页，CSS用Flex布局美化并适配移动端。
-
图片在Grid中拉伸变形的根源是img未设object-fit且父容器无明确尺寸约束；需先为griditem设置宽高或aspect-ratio，再对img应用object-fit:cover/contain并配overflow:hidden与object-position。
-
p系列工具类是Tailwind预编译的原子类，用于设置内边距：pt/pb/pl/pr分别控制上/下/左/右，px/py控制水平/垂直双向，数值映射theme.spacing，默认单位rem。
-
有序列表用<ol>和<li>标签实现，type属性设置编号类型（如A、a、I、i），start属性定义起始值，可嵌套多层用于步骤展示。
-
应使用MutationObserver替代已废弃的DOMNodeInserted等事件；它异步批量处理变化，需配置childList或attributes等选项，并注意disconnect避免内存泄漏。
-
background-position动画比opacity切换更稳，因其用渐变光带平滑扫描模拟内容生成，不依赖DOM可见性、不触发重排，且需linear缓动、起始值设为-100%/100%、避免will-change；伪元素::after实现解耦占位与语义，需relative定位、inset:0全覆盖、同步border-radius；图片骨架用aspect-ratio+内联SVG确保响应式；真实图片加载后需尺寸/样式严格对齐骨架，onload时同步切换opacity与visibility以无缝过渡。
-
本文介绍一种专业、健壮的字符串分段方法：在不超过各字段长度限制的前提下，优先在空格处断行，确保单词不被截断，适用于地址、标题等需语义完整显示的场景。
