-
Bootstrap通过Collapse插件实现导航菜单折叠，使用data-bs-toggle和data-bs-target控制目标元素显隐；Tailwind需结合JavaScript手动切换hidden类来控制菜单显示状态，依赖响应式前缀适配不同屏幕。
-
img加width:100%无效主因是父容器无宽高或max-width:none覆盖；需设父级宽度、img用width:100%+height:auto，并排查样式冲突。
-
Less中用.make-col循环生成响应式列类需基于@grid-columns动态计算宽度，嵌套断点媒体查询，联动声明.make-row负边距与.make-col内边距，并用extract()按需过滤列数与断点以控制CSS体积。
-
color-mix()必须显式指定颜色空间（如insrgb）并用小数（如0.5）而非裸百分比（如50%）表示权重；不支持calc()等函数动态计算权重，仅限静态值。
-
CSS变量不支持语法嵌套，但可通过命名约定和作用域实现逻辑层级。1.无法像编程语言那样嵌套定义变量；2.可采用BEM风格命名如--color-primary模拟层级；3.利用作用域在不同选择器中覆盖变量值，实现主题切换；4.支持变量间引用，通过var()构建依赖关系，集中管理设计系统。核心是借助级联与继承而非语法嵌套。
-
place-items是CSSGrid专用简写属性，用于同时设置justify-items和align-items，仅在display:grid容器上生效，控制直接子项在网格单元格内的对齐，不适用于Flex或普通块级布局。
-
HTML5的<mark>标签专用于语义化高亮文本，但默认不支持点击交互；需通过<button>包裹、添加role="button"+tabindex+键盘事件监听，或JS委托绑定事件来安全实现交互，同时兼顾可访问性与样式覆盖。
-
Flex子项默认不收缩到内容宽度以下是因浏览器强制设定「最小内容尺寸」下限，由最长不可折行内容（如长单词或图片）决定；该尺寸是flex-shrink的收缩极限，min-width:0可覆盖此限制使收缩生效。
-
metarefresh会触发页面重载或跳转：仅设秒数（如content="3"）时重载当前页；含url=（如content="3;url=/login"）时才跳转。
-
最直接有效的JavaScript调试方式是结合浏览器DevTools断点调试、console高级用法、debugger语句及VSCode集成调试；核心在于Sources面板设断点，善用console.table/group/time/trace，条件断点与debugger配合，再通过VSCode实现源码级调试。
-
D3.js是数据驱动的SVG可视化库，需手动绑定数据与DOM元素，适合深度定制；通过select、data、enter、attr等方法构建图表，配合scale、axis、transition实现映射、坐标轴和动画。
-
FoodiePro图片不居中是因CSS优先级覆盖，需加.wp-post-image.aligncenter{margin:0auto;display:block}；古腾堡应改用“封面”区块并手动设class为wp-post-imagealigncenter；移动端裁切需在子主题禁用crop并重生成缩略图；the_post_thumbnail()参数名须与add_image_size注册名完全一致。
-
前端无法强制执行“每分钟限10次”限流，只能依据后端返回的X-RateLimit-Remaining、Retry-After等响应头做UI反馈，如禁用按钮、倒计时提示，并结合localStorage存储时间戳实现跨刷新的状态同步。
-
可通过HTML5Canvas与JavaScript实现烟花效果：先创建画布并获取2D上下文，再定义含位置、速度、颜色等属性的粒子类，通过explode函数批量发射粒子，主循环中更新粒子状态、绘制带透明度衰减的图形，并及时清理死亡粒子。
-
使用Flexbox的gap和flex-wrap可实现响应式列表布局，gap统一控制项目间距，避免margin问题，flex-wrap允许项目自动换行，结合justify-content优化对齐，通过媒体查询在不同断点调整gap值，适配多设备显示，提升布局灵活性与美观性。
