-
padEnd()是实现固定宽度终端动画的核心工具，通过统一补足字符串长度避免光标跳动；需预设基准宽度、配合\r原地刷新、分离动态静态内容，并慎用Unicode字符以防越界。
-
浮动（Float）用于元素横向排列，通过float:left或float:right使元素脱离文档流并左/右对齐，常用于多列布局；多个浮动元素在容器宽度足够时会并排显示，如.left-box设width:60%、float:left，.right-box设width:40%、float:right可实现两栏布局；但浮动会导致父容器高度塌陷，需通过clear:both、overflow:hidden或伪元素::after{content:"";display:table;clear:both}清除浮动；使用
-
BEM通过block__element--modifier命名强制作用域隔离，降低样式覆盖成本；禁用复杂选择器、依赖工具链校验与编辑器支持，并需配合设计令牌管理全局变量。
-
{}与{}不是同一个键，因为Map键比较基于引用而非结构相等，每次{}创建新对象实例，内存地址不同，Map视为独立键。
-
用[href$=".pdf"]可精准匹配以.pdf结尾的URL并添加图标，因$=操作符只匹配属性值结尾，比*=更安全；需注意空格、协议不影响匹配，但IE8不支持。
-
使用Flexbox实现导航栏内容排列，结合Grid构建页面整体结构，通过媒体查询实现响应式布局，体现“Grid管结构、Flex管内容”的设计原则。
-
HTML5Canvas绘制矩形有四种方法：一、fillRect()直接绘制实心矩形；二、strokeRect()仅绘制空心边框；三、rect()结合beginPath()与fill()/stroke()定义路径；四、clearRect()清除指定矩形区域。
-
直接设width和height无效，应采用padding-bottom:100%模拟正方形或aspect-ratio+table-layout:fixed锁死尺寸，避免被内容撑开。
-
极简按钮需用最少CSS属性实现清晰交互，推荐语义化<button>，核心样式含background-color、color、border:none、padding、border-radius；须兼顾:hover/:active反馈、disabled状态处理及深色模式适配。
-
伪元素垂直居中推荐用flex布局：宿主元素设display:flex和align-items:center，伪元素自动参与居中；单行文本可配合line-height与height相等及vertical-align:middle；绝对定位+transformtranslateY(-50%)为备选方案。
-
Object.getPrototypeOf是运行时探测原型链的关键工具，需结合遍历、比对、混入识别等构建继承审计机制，用于验证类库真实继承关系、检测覆盖断裂、定位隐式代理层，并规避Proxy等干扰。
-
可通过GitHubPages、Netlify、GoogleDrive或Vercel将HTML文件部署为云端网页。2.GitHubPages需创建用户名.github.io仓库并推送index.html，访问对应域名即可发布。3.Netlify支持拖拽上传ZIP文件夹，自动分配子域名并可自定义设置。4.GoogleDrive上传后需借助gdrive.link等工具转换分享链接为可访问网页URL。5.Vercel可通过导入项目或上传ZIP部署，自动构建并提供.vercel.app临时访问地址。
-
P95/P99比平均值更适合识别性能毛刺，因其反映最慢5%/1%请求的耗时上限，能暴露被均值稀释的尾部异常；需结合时间切片、链路分层和异常指标下钻定位根因，并采用滑动窗口、分场景监控与阶梯告警等策略。
-
grid-row跨行必须指定起始和结束行线，如2/4占第2、3行；支持命名线如a/c，span需配合起点如3/span2；单独span2由浏览器自动分配起点但不可控。
-
必须同时设置-webkit-background-clip:text、background-image和color:transparent才能实现彩虹文字；Firefox不支持该特性，需提供降级方案；动画时需显式声明background-size以确保滚动平滑。
