-
BEM命名法通过块（Block）、元素（Element）、修饰符（Modifier）将UI拆分为独立单元，如.btn、btn__text、btn--large，提升样式可维护性与团队协作效率。
-
应优先使用max-width而非width——它设上限而不强制固定尺寸，配合width:fit-content或inline-block实现内容自适应且不超限；width仅适用于需等宽的按钮组，并须搭配flex/grid布局。
-
根本原因是依赖固定像素值，应改用百分比+calc()、flex布局、rem单位及CSS变量等相对方案实现响应式定位。
-
1、使用LiveServer扩展可实现自动刷新预览，安装后右键选择OpenwithLiveServer即可在浏览器中实时查看HTML页面效果。
-
作用域链是函数创建时确定的词法环境嵌套引用链，由[[Environment]]槽静态绑定形成；变量查找沿此链逐级向上访问EnvironmentRecord，遵循词法作用域规则，与调用位置无关。
-
border-radius支持四种参数写法：单值、双值、三值、四值，以及斜杠分隔的水平/垂直半径组合；还可通过四个独立属性精准控制单角。
-
清屏本质是清空容器内容而非销毁结构；推荐用document.body.textContent=''或element.replaceChildren()，避免innerHTML=''引发事件丢失和组件失联，清空后需重绑事件、清理定时器、重置WebComponents状态。
-
可用::before伪元素配合transform:scale()与过渡动画实现链接hover时背景“轻微扩散”效果：通过相对定位、绝对定位伪元素，初始小缩放+大圆角，hover时放大并减小圆角，配合inset和transform-origin优化适配性。
-
:checked+~选择器可控制同级后续兄弟元素显隐，要求input在前、目标元素在后且同父；单选用name分组独立控制，多选用~实现任一触发，需兼顾可访问性与兼容性。
-
width:auto和height:auto不触发响应式缩放，仅恢复默认尺寸计算；SVG应用viewBox+width+height:auto实现等比缩放；位图需object-fit配合固定容器；避免HTMLwidth/height属性覆盖CSS。
-
图片左滑入场需用@keyframes定义translateX(-100%)到translateX(0)，绑定animation并加forwards，确保初始位置在视口左外侧且样式权重足够。
-
使用position:fixed可使元素悬浮于视口固定位置，需配合top/right/bottom/left定位、z-index层级控制、响应式媒体查询适配、body内边距避让、@supports兼容性检测及will-change硬件加速修复滚动跳动。
-
本文介绍在React应用中可靠监听浏览器后退操作（如点击返回按钮或调用history.back()），并在用户确认后执行登出逻辑，解决原生popstate事件在现代ReactRouter环境中失效的问题。
-
字体列表顺序决定浏览器加载优先级，从左到右依次查找可用字体，未找到则回退到默认字体。包含空格或特殊字符的字体名需加引号，推荐始终添加通用字体族如sans-serif作为最终回退。通过@font-face引入的自定义字体在成功加载后会按顺序参与匹配并优先使用。合理设置字体堆栈可确保跨设备良好显示。
-
TypeScript是JavaScript的超集，所有合法JS代码都是合法TS代码，其核心价值在于类型系统与编译时检查，而非运行时能力；真正使用TS需主动定义interface/type、利用泛型、字面量类型等实现接口契约。
