-
推荐用scale(0.95)或scale(0.98)起始而非scale(0)，避免布局塌陷；动画需等图片加载完成再触发，通过JS监听load后添加class或结合animation-delay/forwards控制；必须预设宽高、display:block等防layoutshift；注意Safari兼容性及overflow裁切问题。
-
本文详解因CSS浮动（float）引发的页脚与上层内容粘连问题，通过清除浮动、避免脱离文档流等专业方案，实现页脚独立定位与样式控制。
-
日常开发中优先用auto，除非明确需强制滚动条（scroll）或彻底裁剪（hidden）；auto只在内容溢出时显示滚动条，hidden完全裁剪无提示，scroll始终显示滚动条影响视觉。
-
能，但不是“自动模块化”；<link>仅实现物理拆分与手动组织，无作用域或依赖管理，需构建工具或运行时策略保障模块化效果。
-
直接清除浏览器默认边框并用border重绘，配合:focus和:hover实现状态反馈：先设outline:none、border:1pxsolid#ccc、background-color:#fff、box-sizing:border-box；聚焦时改border-color为#409eff并加box-shadow光晕，加transition动画；兼顾可访问性需设:focus-visible；微调border-radius:4px、padding:8px12px、font-size:14px/16px、
-
order属性可改变Flex子元素显示顺序而不影响HTML结构，例如设置.item1{order:2}、.item2{order:1}时显示为item2、item1、item3；在响应式设计中，通过媒体查询调整order值可使移动端内容优先展示，如将.content的order设为0、.sidebar设为1、.header设为2，实现侧边栏下移；需注意order仅改变视觉顺序，不影响DOM与屏幕阅读器顺序，应避免滥用以保障可访问性，且宜配合flex-direction考虑主轴方向，其在Grid布局中也有效
-
三栏结构不对齐的主因是容器或子项默认行为未约束。需设父容器display:flex、justify-content:space-between、align-items:stretch，统一box-sizing:border-box，子项用flex:1而非width百分比，并用flex-column居中内容。
-
HTML本身不是编程语言，不消耗CPU；网页卡顿主因是JavaScript执行、CSS渲染、DOM重排重绘，在低压CPU上因频率低、缓存小、单核弱而被显著放大。
-
HTML中行内元素（如<sup>）因换行或缩进产生的空白字符会被浏览器渲染为实际空格，导致文本间出现不期望的间隙；解决方法是将<sup>与前后文本写在同一行，或使用CSS移除空白节点影响。
-
<section>仅用于有标题的独立章节，不可替代<div>或<article>；<aside>表附属内容，<nav>专指导航链接；<main>每页唯一且不可嵌套；HTML5大纲算法已失效，标题层级取决于<h1>–<h6>显式顺序。
-
<map>标签必须配合<img>的usemap属性且与<map>的name严格匹配才能生效；coords值依shape类型而定，原点为图片左上角，不响应CSS缩放；<area>支持href、target等链接属性，alt不可省略；响应式下需改用SVG或绝对定位方案。
-
结论：inputtype="file"配合accept="image/*"与capture="user"/"environment"是最轻量兼容的纯HTML调起摄像头方式；capture="camera"非标准且已失效，iOS会禁用相册、Android行为不一，需UA检测动态设置；漏写accept则capture无效；上传后需处理EXIF方向。
-
ESLint--fix不能自动修复逻辑错误，因为它仅支持格式类问题（如缩进、分号）和部分可推断的静态规则（如no-unused-vars），而逻辑错误（如if(x=0)、for循环条件错误）需语义分析，无法安全自动修正。
-
vertical-align对浮动元素无效，仅适用于行内级元素和表格单元格；替代方案是用inline-block配合vertical-align或直接使用flex实现垂直居中。
-
答案：使用ApolloClient配置WebSocketLink实现GraphQL订阅，通过useSubscription监听实时数据，需前后端协同支持。
