-
PostCSS-pxtorem没生效主因是插件顺序错误、构建工具配置位置不对或样式未走PostCSS流程；rootValue必须与HTML实际font-size严格对应；需合理配置exclude和propList控制转换范围。
-
Flex容器滚动卡顿主因是浏览器对flex-wrap布局的O(n²)算法复杂度，子元素超200个时重排耗时骤增；可用content-visibility:auto（配contain-intrinsic-size）、优化flex-basis、或改用Grid/绝对定位缓解。
-
IE10/11中flex-basis被完全忽略，需用-ms-flex+width双声明并设box-sizing:border-box兜底。
-
浏览器本地存储数据不以明文文件形式暴露在系统路径中，Chrome等浏览器使用LevelDB等私有格式存于用户目录下，但路径不公开且不可靠；唯一可靠读取方式是在同源页面中用JavaScript调用localStorage等API，或通过开发者工具的Application面板查看。
-
推荐使用display:flex+justify-content:flex-start实现图片左对齐，不破坏文档流；float:left已过时且需clear:both清除浮动；text-align:left需作用于父容器且图片保持inline；注意vertical-align和全局样式干扰。
-
font-family按顺序匹配字体，遇首个存在即停止；中文场景应按“系统首选→同类替代→系统泛用→通用族类”排序，如"PingFangSC","MicrosoftYaHei","NotoSansCJKSC",system-ui,sans-serif，并确保引号、逗号、大小写正确。
-
ID选择器赢，因其权重100高于class选择器的10；同元素同属性时，ID规则覆盖class规则，浏览器开发者工具中被划掉的样式即被更高权重要素覆盖。
-
overflow:auto并非修复浮动溢出，而是触发BFC使父容器重新计算高度并包裹浮动子元素；它避免高度塌陷，但可能影响绝对定位、滚动行为及旧版Safari渲染。
-
@import不该用于CSS表单样式统一，因其阻塞渲染、无法被预处理器内联或Tree-shake，导致加载延迟与首屏卡顿；应改用<link>并行加载form-base.css，并确保其仅含控件重置与语义类名。
-
JavaScript深拷贝中，JSON方法无法正确处理Date和RegExp对象，会丢失类型信息；Lodash的cloneDeep默认支持，通过newDate()和newRegExp()重建实例；手写需显式判断类型并兼容IE。
-
HTML本身不提供排行榜或积分明细功能，其作用仅限于语义化结构渲染；动态数据需由JS或服务端驱动，HTML应专注可访问性、可维护性与明确的数据边界。
-
用记事本写HTML需注意：文件名必须为index.html（小写），编码选UTF-8（无BOM）；必备四要素——<!DOCTYPEhtml>、<htmllang="zh-CN">、<head>中<metacharset="UTF-8">（在<title>前）、非空<body>；本地双击打开用file://协议，图片用相对路径，JS模块需本地服务；验证用W3C校验器。
-
应使用min-resolution:2dppx判断Retina屏，因dppx基于CSS像素比更稳定；1dppx=1CSS像素，2dppx表示1CSS像素由至少2×2物理像素渲染；避免混用dpi与dppx，防止误触发。
-
Flex布局下标签云换行需设flex-wrap:wrap，用gap控制均匀间距，配合white-space:normal和word-break:break-word处理长文本，再以clamp()实现响应式字体缩放。
-
<p>顶部进度条必须用JavaScript动态计算滚动比例：取Math.max(document.body.scrollTop,document.documentElement.scrollTop)为真实scrollTop，再代入(scrollTop/(document.documentElement.scrollHeight-window.innerHeight))*100得准确百分比，配合style.width实时更新；position:sticky无法替代，纯CSS无解。</p&g
