-
transform:translateY()是卡片悬停升起的唯一靠谱方案，因不触发重排、仅合成，配合transition和多层box-shadow可实现顺滑立体浮起效果。
-
IE11仅支持2012年旧版CSSGrid规范，需手动将display:grid改为display:-ms-grid，并用-ms-grid-column/-ms-grid-row等属性替代现代语法，fr单位须换算为具体数值或百分比，Autoprefixer仅加前缀不降级语法。
-
三列布局不能直接写width:33.33%因盒模型默认下padding、border、margin会超出容器宽度，需用box-sizing:border-box并设width:33.333%，配合overflow:hidden或display:flow-root清除浮动塌陷，再通过媒体查询降级为单列，并推荐Flexbox替代以规避兼容与计算问题。
-
直接用setTimeout返回值无法可靠取消任务，因为定时器ID是数字且函数执行完即丢失；若在异步回调中取消，ID已不可访问，而全局声明会导致多个任务互相覆盖；闭包可天然绑定每次调用的独立状态，使cancel函数与timeoutId共享词法环境，确保状态隔离、取消及时、引用干净。
-
防抖和节流是前端优化高频事件的两种手段：防抖通过延迟执行，仅在事件停止触发后执行一次，适用于搜索输入等场景；节流则保证在指定时间间隔内最多执行一次，适合滚动监听等频繁操作。两者核心区别在于执行时机与频率控制，合理选择可提升性能与用户体验。
-
焦点捕获（trapfocus）是手动限制键盘Tab键在模态框内循环聚焦的技术，因HTML原生不支持且dialog元素不自动限制Tab范围，必须用JS监听keydown、判断首尾可聚焦元素并强制focus，以满足WCAG2.1AA可访问性要求。
-
必须在iframe内部页面的CSS中设置滚动条样式，通过WebKit伪元素自定义外观，仅支持同源页面和WebKit内核浏览器，跨域时无法修改，可采用外层容器模拟滚动条作为替代方案。
-
使用伪类after清除浮动，通过添加clearfix类实现父容器高度自适应；2.设置父容器overflow:hidden或auto触发BFC包含浮动；3.采用display:flow-root创建BFC，现代浏览器推荐方案；4.避免使用额外clear元素。建议优先选择::after或flow-root方法。
-
HTML中没有section_标签，下划线非法，浏览器将其视为无语义的自定义元素；应使用标准section标签配合class（如user_profile）实现语义化与命名自由。
-
<embed>标签没有object属性，该属性不存在于HTML标准中，浏览器会直接忽略；正确传参应使用<object>标签配合data属性和<param>子元素。
-
display:inline-flex使容器为行内级元素且子项按Flex布局排列；它不因HTML空白产生间隙，支持justify-content/align-items精确控制，而inline-block会受空白节点影响且仅能靠text-align或margin模拟对齐。
-
事件监听器应优先使用addEventListener绑定，及时清理防止内存泄漏，集中管理避免重复注册，并按场景选择委托、节流等优化策略。
-
负margin是最直接兼容的“移出父容器”手段，但不脱离文档流；transform:translate()视觉位移且占位不变；position:absolute+负值才真正脱离流；overflow:visible对负定位元素无效。
-
应选用TinyMCE、Quill或CKEditor5等富文本编辑器直接替换textarea，初始化时绑定DOM节点，通过getData()获取HTML并同步至hiddeninput，确保表单提交含格式数据。
-
脚本不生效通常因加载顺序、执行时机或路径问题。应确保脚本在DOM构建后执行，如置于body底部或使用DOMContentLoaded事件；检查外部脚本路径正确性及网络加载情况，排除404或CORS问题；合理使用async与defer避免执行错序；通过console.log、开发者工具和错误提示验证脚本是否加载运行，逐步排查定位问题。
