JOIN语法错误会导致结果为空或笛卡尔积；ON条件漏写、字段错用、WHERE误代ON是主因；LEFTJOIN中右表非空条件须放ON；GROUPBY需与SELECT非聚合字段严格一致；UNIONALL比UNION快2–5倍；关联字段类型不一致将致索引失效。

flex-direction是最常被重写的弹性容器属性，需确保父容器已声明display:flex；移动端（≤768px）用column，桌面端（≥1025px）用row并配justify-content；注意特异性、align-items在列布局下的影响、gap回退及性能优化。

grid-template-rows和grid-template-columns是定义显式网格的必需属性，必须写在容器上，值为轨道尺寸序列；fr单位按剩余空间分配，非百分比；repeat()配合auto-fit和minmax()可实现响应式列布局；隐式网格需用grid-auto-rows等控制溢出项高度。

最简可靠方式是同时设置justify-content:center和align-items:center，前提是父容器为display:flex且有明确高度；仅justify-content不足，因它只控制主轴对齐，align-items才控制交叉轴居中。

本文详解如何使用groupby().apply()正确实现对多个列同时传入自定义函数（如需基于列B的条件筛选列A并计算均值）的分组聚合，解决agg()中混用命名元组与lambda导致的TypeError。

本文详解如何在EtchASketch类项目中，通过清空容器元素（而非删除整个节点）来高效重置网格，避免作用域与重复声明问题，同时保留原有逻辑结构与事件绑定能力。