-
min-width会覆盖box-sizing的计算结果，当min-width值大于width时，浏览器以min-width为准确定最终宽度；需在开发者工具Computed面板检查min-width实际值是否超标。
-
Element.requestFullscreen()必须由用户手势（如click）同步触发，禁止在onload、setTimeout或异步回调中调用；iframe需添加allow="fullscreen"；整页全屏用document.documentElement.requestFullscreen()；退出时监听fullscreenchange并用dvh单位防布局跳变。
-
Less变量通过独立variables.less配合构建工具动态注入实现多主题切换，Mixin封装主题敏感逻辑，构建时生成多CSS文件或映射为CSS变量配合JS切换，需避免硬编码和作用域错误。
-
Chrome浏览器在移动端对react-material-ui-carousel的原生swipe事件过于敏感，常将页面垂直滚动误判为水平滑动，导致轮播意外切换；本文提供无需更换库的轻量级解决方案：用react-swipeable自定义手势控制，精准隔离滑动方向并手动触发导航。
-
直接newInputEvent('input')无法触发Vue/React响应式更新，因为该构造函数不修改input.value，而框架依赖value变更与事件协同；必须先手动赋值再dispatch事件。
-
节流函数必须用闭包，因为需在多次调用间私有持久地共享lastTime或timer状态；不用闭包则依赖全局变量，导致污染、竞态及多实例冲突。
-
商品卡片应使用语义化HTML结构：用<article>包裹，标题用<h3>，价格等关键字段用带语义类名的标签（如<spanclass="price">），主图<img>必须含描述性alt属性，促销标签用<spanrole="note">，按钮统一为<buttontype="button">；CSS布局优先用flex实现单列流，大屏再切grid，禁用固定高度，图片区域设aspe
-
Proxy响应式核心是通过get/set拦截实现依赖收集与更新触发：读取时自动记录副作用函数为订阅者，写入时精准通知相关更新，并配合effect/trigger构建闭环，支持嵌套路径与数组边界处理。
-
首屏白屏时间长通常不是HTML文件本身加载慢，而是其触发的阻塞行为所致，如未优化的script、无尺寸图片、同步CSS或服务端响应慢。
-
ServiceWorker无法实现真正的版本镜像，仅能通过语义化缓存名、精准URL匹配及install/activate分阶段控制模拟；缓存名须含可维护版本标识（如static-prod-v2.3.1），install阶段只写新缓存，activate阶段再清理旧缓存，并确保预缓存URL与页面请求URL完全一致。
-
history.pushState()是浏览器原生支持的无刷新跳转核心方法，通过操作history对象新增历史记录、更新URL（同源相对或绝对路径），不触发重载；需配合popstate事件监听及手动内容加载实现完整SPA路由。
-
初学者推荐VSCode、SublimeText、Brackets和Notepad++四款HTML编辑器：VSCode免费开源，支持LiveServer实时预览；SublimeText简洁高效，可无限试用；Brackets专为前端设计，具同步实时预览；Notepad++极简轻量，适合Windows入门。
-
:lang()选择器更可靠，因它依赖语言继承而非显式lang属性，大小写不敏感且支持BCP47，兼容性好、不污染HTML，适合多语言字体控制与精准样式匹配。
-
createElement()创建的元素不显示，因其仅生成游离DOM节点，未挂载到文档树中；必须用appendChild()等方法显式插入父容器，否则浏览器不渲染。
-
display:box是2009年草案的独立布局模型，与现代flex无继承关系，仅在Chrome≤28、Safari≤7等极旧环境可用，需显式写-webkit-box-orient，不可混用flex，现仅line-clamp等特定场景必须保留。
