在 VSCode 中管理 npm 脚本，不需要反复切到终端敲命令——用好内置功能和少量扩展，就能点一点运行、调试、甚至可视化查看脚本依赖关系。

当多个 div 或其他块级元素并排显示，容器宽度不够时，默认会溢出或压缩。用 display: flex 配合 flex-wrap: wrap 是最直接、可控的自动换行方案。

表格边框重叠，其实是默认情况下 border-collapse 为 separate 导致的——每个单元格都自带独立边框，相邻边框之间会留出间距，视觉上就像“双线”或“错位”。解决方法很简...

默认情况下，align-items: center 确实会让子元素沿交叉轴（垂直方向）居中，但如果你发现图片和文字视觉上还是“错位”，大概率是因为图片默认是 inline 元素，会受 ve...

直接在 CSS 中定义颜色变量，让开发与设计系统保持一致，关键是把设计规范里的色值转化为可维护的 CSS 自定义属性（CSS Custom Properties），并建立清晰的命名和层级结...

用类选择器（class selector）是最直接、最可靠的方式——它天然只作用于带有指定 class 的元素，完全不影响其他标签或未加该类的同类标签。

直接在 Elements 面板中右键目标元素 → 选 Reveal in Styles，就能跳转到右侧 Styles 面板中该元素实际生效的全部规则。重点看带删除线的声明——它们被更高优先...

页面元素在做位移动画时如果出现卡顿或不流畅，通常是因为直接改变了会影响布局的属性（如 left、top、margin 等），导致浏览器频繁触发重排（reflow）和重绘（repaint）。...

要让一个网格项跨多行，必须用 grid-row 指定起始和结束行线。它不接受“跨 2 行”这种相对描述，只认行线编号（从 1 开始）或命名线。

子元素在 CSS Grid 中无法居中，通常不是 justify-items: center 和 align-items: center 组合本身有问题，而是它们作用的对象和前提条件被忽略...