-
可通过第三方应用如HTMLViewer在iOS设备上直接预览HTML文件，支持实时渲染；2.利用Safari浏览器从iCloudDrive或文件App中打开本地HTML文件，实现快速查看；3.对复杂项目可使用Pythonista等应用搭建本地服务器，通过HTTP服务运行HTML；4.借助JSFiddle、CodePen等在线平台粘贴代码并预览，实现云端即时渲染。
-
给ul设置display:flex并配合justify-content、gap和flex-wrap等属性实现li横排与响应式布局，避免使用float、inline-block等过时或易出错方式。
-
grid-template-areas与grid-area配合使用可实现语义化布局：容器通过字符串定义区域结构，子元素用grid-area分配到对应区域，提升代码可读性与维护性。
-
CSS盒模型只有标准盒模型和IE盒模型两种，标准模型中width/height仅指内容区，总宽=content+padding+border；IE模型中width/height包含content、padding和border，内容区自动收缩；通过box-sizing属性切换：content-box为标准模型，border-box为IE模型。
-
该错误并非项目代码问题，而是由Chrome浏览器中某款扩展（如QuillBot）劫持并尝试加载本地字体资源所致；只需临时禁用相关扩展即可立即解决，无需修改HTML、CSS或配置manifest文件。
-
flex-direction:column实现底部自适应的关键约束是父容器必须有明确高度（如min-height:100vh），否则flex:1或margin-top:auto失效；仅中间内容区设flex:1，头部和底部用flex:00auto。
-
用linear-gradient实现按钮背景渐变时，需省略background-color、至少设两个色标、配合background-clip避免露白；radial-gradient宜用百分比定位圆心并设transparent控制光晕；须声明纯色兜底防降级失效，注意多层叠加性能与色觉可访问性。
-
图片未铺满主因是父容器无高度，需设html和body为height:100%并清除margin/padding；装饰图用background-image，语义化需求用<img>配object-fit:cover；Safari下vh容器需动态适配；高清屏需@2x图或SVG替代。
-
WeakSet只能存储对象且不阻止垃圾回收，仅提供add()、delete()、has()方法，适用于对象身份标记等无需影响对象生命周期的场景。
-
使用类选择器可精准选中带特定类名的元素。1.基本写法用“.类名”选中所有该类元素，如.highlight设置文字红色；2.多类组合用“.类1.类2”连写选同时拥有多个类的元素，注意无空格表示“且”关系；3.限定标签类型可用“标签.类名”如p.highlight仅作用于段落；4.结合结构选择器如.container.title选后代元素。掌握点号语法与组合规则即可灵活应用。
-
首先确认浏览器支持硬件加速编码，通过VideoEncoder.isConfigSupported()检测配置兼容性并选择H.264等广泛支持的格式；接着创建VideoEncoder实例，设置hardwareAcceleration为'prefer-hardware'以优先启用硬件编码，同时配置输出回调处理编码后的chunk；然后将来自摄像头、canvas等源的图像数据封装成VideoFrame对象，按时间戳顺序输入编码器，并控制队列大小避免积压；最后在编码结束时调用flush()完成剩余帧编码并关闭编码器
-
使用Flexbox和Grid可实现响应式卡片等高排列。1.Flexbox通过display:flex与align-items:stretch使卡片自动拉伸，适合一维布局；2.Grid利用display:grid与repeat(auto-fit,minmax(250px,1fr))实现二维等高控制，多行更稳定；3.响应式推荐优先使用Grid，结合gap和minmax优化断点适配，保持视觉整齐。
-
Vite构建的单页应用（SPA）部署到静态托管平台（如Vercel、Netlify、Nginx）后，直接访问/login等子路径返回404或跳回首页，根本原因是服务端未正确配置SPA路由回退机制。
-
浮动元素的margin不生效？先确认是否触发了BFC直接给浮动元素设margin看似合理，但常发现上下间距“消失”或“塌陷”——根本原因是浮动元素脱离文档流，其margin与父容器或其他非浮动块之间不再按常规盒模型计算。尤其当父容器没清除浮动时，margin-top和margin-bottom往往视觉上无效。解决前提是：让浮动元素之间的间距真正由margin控制，而不是靠父容器“猜”高度。关键一步是确保父容器形成BFC（块级格式化上下文）。给父容器加overflow:hidd
-
Grid容器需设position:relative，因absolute定位依赖最近已定位祖先，而grid容器默认static不构成定位上下文，否则子元素将相对于视口定位。
