-
右键菜单查看源代码可获取网页原始HTML；2.使用F12开发者工具可查看JS动态生成的实时DOM结构；3.地址栏执行JavaScript代码可直接弹出完整HTML内容，适合快速复制。
-
推荐用grid-template-columns:repeat(auto-fit,minmax(280px,1fr))实现自适应列数，auto-fit合并空轨道，minmax控制每列弹性范围，配合box-sizing:border-box和卡片内部流式布局，避免固定宽高导致错位。
-
必须用kebab-case（中划线分隔），如header-nav.css；snake_case在旧版Windows+Node中易触发缓存异常，PascalCase/camelCase易与JS模块混淆且不符HTML语义惯例。
-
HTML5中readonly属性的正确写法是直接在支持文本输入的元素（如input[type="text"]、textarea）上添加布尔属性readonly；它使字段可聚焦、可复制、值可提交，不同于disabled。
-
浮动与inline-block可结合用于灵活布局。1.解决间隙：父元素font-size设0或移除HTML空格；2.混合布局：侧栏用float，内部卡片用inline-block；3.清除浮动影响：通过BFC或clear避免错位，调整vertical-align对齐；4.响应式处理：设置box-sizing、white-space，媒体查询中切换显示模式。建议高控场景用浮动或Flexbox，文本流用inline-block。
-
HTML5Dialog的close()方法无效，通常因未调用showModal()/show()或元素未挂载到DOM；open属性只读，应使用hasAttribute('open')判断状态；Safari等旧浏览器需降级处理并手动管理焦点与ESC。
-
异步生成器通过“拉取”模式解决大文件处理中的内存溢出和背压问题，利用forawait...of按需读取数据块，避免一次性加载全部内容，提升稳定性和代码可读性。
-
使用Flexbox和object-fit可创建自适应图片画廊。1.设置容器display:flex、flex-wrap:wrap实现自动换行；2.子项设flex:11200px使图片最小宽200px并可伸缩；3.设height和object-fit:cover确保图片保持比例且填满区域；4.可选aspect-ratio统一显示比例；5.用gap控制间距，justify-content:center居中对齐。
-
使用float属性可实现左右浮动按钮布局，通过设置.btn-left{float:left;}和.btn-right{float:right;}实现对齐，配合overflow:hidden防止父容器塌陷，并用margin控制间距，建议统一height、line-height保证垂直对齐，虽兼容旧浏览器但推荐新项目使用Flexbox。
-
HTML5特性检测应优先使用in操作符判断全局API存在性、typeof检测函数类型、创建元素试探行为，避免依赖UA或documentMode。
-
line-height推荐用无单位数值（如1.5），因其基于自身font-size、继承安全且响应式友好；用px或em易致行距塌陷或爆炸，内联元素需配合display或padding才显效。
-
本文详解为何直接JSON.stringify()无法上传文件，以及如何使用FormData正确提交含图片的用户资料更新请求，确保姓名、邮箱与头像同步更新成功。
-
最稳方案是父容器设display:flex并align-items:center，子项自动水平排列且垂直居中；inline-block易因空白符出缝隙，float已淘汰。
-
使用absolute定位结合媒体查询实现响应式侧边栏：1.通过position:absolute使侧边栏脱离文档流，固定于屏幕左侧；2.利用mediaqueries在小屏下调整宽度或隐藏侧边栏，主内容自适应；3.配合transform和JS实现抽屉效果，优化移动端体验。
-
CSS中不存在“颜色选择器”，color是属性而非选择器；需用选择器选中元素后设置color等属性，注意优先级、继承、用户代理样式及color与background-color、opacity的区别，推荐使用CSS自定义属性统一管理颜色。
