直接设置font-size在媒体查询中失效，根本原因是图标类被更具体的CSS规则覆盖，或字体设为inherit但父容器无字号；应确保display值、检查计算值、优先设置容器字号。

应使用background+linear-gradient在网格容器上绘制无侵入的参考线，或用outline高亮hover区域；需匹配grid-template尺寸、设置grid-area属性，并上线前移除调试样式。

flex项目空白区域过大是因flex-grow默认为0，子项仅按自身宽度占据空间；解决需合理设置flex-grow与flex-basis，如flex:1（即flex-grow:1;flex-shrink:1;flex-basis:0%）使项目均分剩余空间。

IE画布渲染慢的根本原因是IE9–11依赖GDI而非Direct2D，且drawImage、putImageData和clearRect触发大量同步重绘与位图拷贝；CSS缩放、非整数宽高、未复用ImageData、开启抗锯齿/阴影均加剧性能下降。

pushState在历史栈中新增一条记录，replaceState用新状态覆盖当前记录；两者均不刷新页面、仅同源生效，且第三个参数title被多数浏览器忽略。

transition用于实现CSS属性的平滑过渡，需配合状态变化触发；其语法包含property、duration、timing-function和delay四个子属性；常用于:hover等交互场景，如颜色、宽度、透明度及变换效果的动画；支持多个属性同时过渡，并通过ease、linear等函数控制速度曲线；注意仅可动画可计算值的属性，推荐将transition定义在初始状态以确保正反向过渡生效。

猎豹浏览器因基于旧版Chromium内核且深度定制，易发生扩展与HTML5功能（如video、WebRTC）的资源冲突，导致黑屏、卡顿等；可通过无痕窗口定位冲突扩展，并针对性配置例外规则或关闭硬件加速修复。

JavaScript移动端性能优化核心是减少主线程阻塞、降低内存占用、适配弱网与低端设备，重点包括控制JS执行时间≤16ms、懒加载、TreeShaking、passive事件、RAF节流、及时清理资源及使用WeakMap等。

取消HTML表格边框的方法有五种：一、设table的border="0"；二、CSS中设border:none；三、设border:0pxsolidtransparent；四、用border-collapse:collapse配合border:0；五、重置框架或继承的边框样式。

可通过浏览器直接打开HTML文件预览效果，需将文件保存为.html格式并确保编码为UTF-8；2.右键选择指定浏览器打开可避免默认程序错误；3.使用VSCode等编辑器配合LiveServer插件实现实时预览；4.对需HTTP环境的功能应使用Node.js启动本地服务器，通过http://localhost:8080访问页面。

优先用margin控制flex项目间距，padding仅用于项目内容内边距；margin参与flex对齐计算且支持负值，padding会增大项目尺寸影响布局；推荐用gap，兼容性场景用margin+:not(:last-child)。

max-width:100%是解决图片撑破容器的核心方案；需配合height:auto保持宽高比，避免使用width:100%，并注意父容器限制、上下文影响及CSS优先级等细节。

并行数据结构是为多线程环境设计的数据容器，旨在保证并发访问时的数据正确性与高性能。传统数据结构如ArrayList或HashMap在多线程下易出现竞态条件、数据不一致和死锁等问题，因其未考虑并发操作的原子性与可见性。解决方案主要包括：使用内置并发集合类（如Java的ConcurrentHashMap、ConcurrentLinkedQueue），它们通过分段锁或CAS操作实现高效同步；手动加锁控制，采用互斥锁、读写锁等调节访问，但需权衡锁粒度对性能的影响；应用无锁算法，利用原子操作如CAS实现lock-f

Fetch基于Promise语法更简洁，适合现代开发；Ajax兼容性好但代码冗长。两者在错误处理、配置灵活性上有差异，Fetch需手动判断响应状态，支持现代化配置，而Ajax需手动管理状态。新项目推荐Fetch或Axios，旧环境可选Ajax。

JavaScript的class是function和原型继承的语法糖，基于原型而非传统类；声明不提升，处于暂时性死区；子类constructor必须先调super()才能用this；方法不可枚举；静态方法挂载类本身；类字段是实例属性，不共享。