-
实现响应式卡片布局的关键是使用Flexbox或Grid结合媒体查询。1.Flexbox通过flex-wrap和flex属性实现一维弹性布局，适合简单排列；2.Grid利用grid-template-columns与auto-fit、minmax函数创建自适应二维网格，更灵活高效；3.媒体查询优化不同屏幕下的间距、字体与排列方式；4.图片设为width:100%确保自适应，内容不溢出。推荐优先使用Grid方案，现代浏览器下简洁且适配良好，老旧浏览器可降级使用Flexbox加媒体查询。
-
1006是客户端在TCP连接无声中断且未收到关闭帧时自动生成的占位码，不来自服务端、无reason、日志不可查，根因需结合网络超时、代理静默断连、进程崩溃等上下文排查。
-
ServiceWorker注册失败主因是HTTPS缺失或路径错误；离线打不开HTML几乎必因未判断request.destination==='document'或缓存资源不全。
-
font-size:0能消除缝隙是因为缝隙本质是父容器中被渲染的空格字符，其宽度由父级font-size决定；设为0后空格不占空间，但子元素会继承该值导致文字不可见，因此必须显式重设字号。
-
按钮点击区域偏移主因是absolute定位时未校准padding对热区的影响，应检查定位基准、用transform替代top/left、加outline验证热区，并统一box-sizing:border-box。
-
HTML表格布局性能问题不在于渲染慢，而在于结构绑架导致整表重排、响应式处理低效；CSSGrid初始计算略重但可控，变化边界清晰，语义正确时性能更优。
-
结论：别用calc()+float封装三栏布局Mixin——兼容性假象大，维护成本真高，现代项目里纯属倒退。因calc()在旧版Safari等浏览器中存在解析异常，float布局本身已过时，且现代项目应优先采用Flexbox或Grid。
-
应使用createElement()创建、remove()删除元素，注意IE兼容性需回退parentNode.removeChild()；动态表单中name属性必须用items[]格式，删除时须移除整个DOM节点；表格操作优先用insertRow()/deleteRow()。
-
background-size:contain不会裁切图片，所谓“被切”实为父容器高度塌陷导致背景渲染区域过小；解决需设明确宽高、aspect-ratio或padding-top百分比技巧，并排查路径、overflow、浮动塌陷等问题。
