-
:not(:defined)可为已声明但未定义的自定义元素（如<my-button>）添加临时样式，需满足命名含短横线、CSS加载时机合理，并注意浏览器兼容性及降级方案。
-
可通过移除icon标签、设href为空或dataURL、配置HTTP响应头禁用请求、或使用1×1透明PNG图标四种方法隐藏HTML5页面图标。
-
合理设置媒体查询断点应以内容驱动为主，参考768px、1024px、1200px等主流视口宽度，优先使用min-width实现移动优先，统一定义断点变量，避免混用max-width，并确保语法正确、viewport标签完备及特性兼容性。
-
答案：开发JavaScript插件时，单元测试能保障代码质量。应选择Jest等测试框架，将核心逻辑封装为纯函数并模块化导出，利用断言和Mock验证行为，覆盖异步与边界情况，并通过覆盖率工具优化测试完整性。
-
使用Bootstrap或TailwindCSS可快速实现轮播图：Bootstrap提供内置组件，通过.carousel类和data属性即可构建响应式轮播；Tailwind需结合Flex布局与JavaScript控制translateX实现自定义轮播，灵活性高。
-
本文详解如何通过优化JavaScript事件逻辑与CSS类控制，实现基于data-name属性的按钮驱动内容筛选功能，解决“点击按钮无响应、分类不切换”的常见问题。
-
必须用kebab-case（中划线分隔），如header-nav.css；snake_case在旧版Windows+Node中易触发缓存异常，PascalCase/camelCase易与JS模块混淆且不符HTML语义惯例。
-
能，但必须先加载Chart.js库并确保DOM就绪；data.labels与datasets[0].data长度须一致；删canvas宽高属性、用CSS控制尺寸以实现响应式；更新数据后需调用chart.update()。
-
响应式等宽列应使用grid-template-columns:repeat(auto-fit,minmax(最小宽度,1fr)))，auto-fit自动调节列数，minmax保障列宽下限与均分，避免Flex因内容干扰导致的不均分或溢出。
-
通过代码分割和懒加载可显著减少单页应用初始包体积。利用动态import()实现路由级按需加载，如React.lazy配合Suspense，Webpack会自动拆分模块为独立chunk。配置splitChunks将第三方库单独抽离成vendor.js，提升缓存利用率。非关键组件（如模态框、图表）也应延迟加载，仅在触发时动态引入。合理划分“立即需要”与“按需加载”的代码，结合构建工具优化，能有效缩短首屏渲染时间，改善用户体验。
-
用vh设置grid-template-rows为什么高度不随窗口缩放？因为vh是相对于视口高度的单位，但父容器若没撑满视口，子网格的vh计算会失效。常见于body或html有默认margin、未设height:100%，或外层包裹了非全高容器。确保html和body都设为height:100%且margin:0网格容器本身需设height:100vh或继承自100%高度的父级（不能只靠grid-template-rows:30vh40vh3
-
JavaScript闭包是函数与其词法作用域中被捕获的外部变量组成的组合，形成于内部函数引用外部变量且在外部函数返回后仍存在时，用于封装私有变量、解决循环绑定问题、实现函数工厂与柯里化等。
-
position:sticky是最轻量的吸顶方案，现代浏览器（Chrome56+、Firefox59+、Safari13.1+）原生支持，但IE不支持，iOS13.0及更早版本存在渲染异常；需用CSS.supports检测并降级JS实现，注意父容器约束、scroll节流、内存泄漏防护及touchmove兼容。
-
使用CSS伪元素::before和::after可为元素添加提示图标或文字，无需额外HTML标签。1.::before和::after通过content属性在元素前后插入内容，常用于添加装饰性图标或提示信息；2.必须设置content属性，否则伪元素不显示；3.利用::before可创建圆形问号图标，样式由CSS控制，保持HTML语义清晰；4.使用::after结合:hover可实现悬停显示提示框，需配合position定位；5.可引入字体图标如FontAwesome，通过Unicode字符显示专业图标，
-
静态方法和属性属于类本身，通过static定义并直接用类名调用。如MathUtils.add()和Counter.count，不依赖实例，this指向类，适用于工具函数、计数器等场景，提升代码组织性。
