-
必填字段的红星不必强制用::after实现，但它是语义清晰、可访问性佳的最优解；应加在label上且仅对required字段生效，因input不支持伪元素；需用color和margin-left控制样式，确保无障碍兼容。
-
本文详解如何绕过TypeScript装饰器的编译时限制，通过手动调用__decorate函数，将自定义装饰器（如属性装饰器）动态应用到无法修改的第三方类（如classA）的指定属性上。
-
父元素高度塌陷是因浮动元素脱离文档流，解决方法是触发BFC（如overflow:hidden）或清除浮动（如::after+clear:both），现代布局推荐直接使用flex/grid。
-
scroll-behavior:smooth必须写在html元素上，因CSS规范限定其仅对根滚动容器生效；body滚动实为html滚动，加在body或其他元素无效，且不可被后代选择器或!important覆盖。
-
锚点跳转失效主因是id与href匹配细节或DOM状态异常：id须全局唯一且不以数字开头；href需为合法hash格式；目标元素须已渲染且可见；可用scrollIntoView()替代或监听hashchange手动滚动，并用scroll-margin-top解决吸顶遮挡。
-
改网页标题只有两种可靠方式：静态写在<head>里的<title>，或运行时用document.title赋值；其他操作均不保证生效，尤其影响SEO和历史记录。
-
box-shadow不仅是加阴影，其默认不占布局空间，但易因blur-radius过大被裁剪、inset误用、多层阴影绘制顺序（从左到右、由远及近）及性能问题被忽视；语法须严格按h-offsetv-offsetblur-radiusspread-radiuscolorinset顺序书写，前两项必填，blur-radius模糊边缘，spread-radius扩大阴影尺寸；多层阴影用逗号分隔，每层参数须完整；inset需配合padding和border使用；响应式下应通过媒体查询、rem或伪元素适配，深色模式
-
结论：inputtype="file"配合accept="image/*"与capture="user"/"environment"是最轻量兼容的纯HTML调起摄像头方式；capture="camera"非标准且已失效，iOS会禁用相册、Android行为不一，需UA检测动态设置；漏写accept则capture无效；上传后需处理EXIF方向。
-
@import在模块化项目中无法按需加载，因其是同步阻塞的原生CSS规则，不参与JS模块依赖图，Webpack/Vite默认不支持其条件加载或拆分，导致全量打包；推荐改用JS层动态importCSS、CSSModules配合提取插件或CSS-in-JS方案。
-
推荐在formsubmit事件中用event.target.elements或FormData获取表单值，避免手动遍历；注意name属性、disabled状态、checkbox/radio的checked判断及enctype设置。
-
现代浏览器（Chrome76+、Edge79+、Firefox75+、Safari15.4+）已原生支持loading="lazy"，但iOSSafari15.4前及微信旧版WebView不识别；仅对<img>和<iframe>生效，须配合src/srcset使用，且需确保图片有明确宽高以防误加载。
-
::before和::after伪元素需配合content属性使用，可在不修改HTML情况下插入内容或装饰，常通过定位实现视觉效果，并应关注性能与可访问性。
-
用<img>的width/height属性仅缩放不裁剪；真正裁剪需容器设宽高+overflow:hidden+object-fit:cover或绝对定位；精确控制用clip-path或Canvas；服务端裁剪更优但需校正EXIF方向。
-
浅拷贝只复制第一层属性，嵌套对象仍共享引用；JSON.parse(JSON.stringify())是最简深拷贝但丢失Date、函数等类型；手写需处理循环引用和内置类型；LodashcloneDeep是生产首选。
-
linkrel="icon"是浏览器识别网站图标的必要标识，必须写在head中；仅加一行无法覆盖所有设备，需配合apple-touch-icon、manifest等多标签及多尺寸、多格式图标才能确保各平台正常显示。
