-
捕获组通过()保存匹配内容，命名捕获组使用?<name>提升可读性；2.零宽断言匹配位置而非字符，包括正向/负向先行和后行断言；3.贪婪匹配尽可能多字符，懒惰模式加?以减少匹配量；4.JS正则不支持递归但可模拟简单嵌套，复杂结构建议用解析器。掌握这些模式可提升字符串处理效率与精度。
-
Proxy用于拦截对象操作，Reflect提供对应的标准方法；Proxy创建代理对象并定义陷阱，Reflect统一默认操作且在Proxy中安全转发行为，二者配合实现响应式等高级功能。
-
Grid是响应式列布局的首选方案，用grid-template-columns:repeat(auto-fit,minmax(250px,1fr))实现列数自适应，配合gap控制间距；Flex适用于高度差异大、仅需换行的轻量场景，需设flex-wrap:wrap和flex:11250px。
-
ARIA属性通过补充语义、状态和行为信息，使屏幕阅读器能理解自定义UI组件。当原生HTML无法满足交互需求时，应选用恰当的role（如tab、dialog）、state（如aria-expanded）和property（如aria-label），并结合键盘导航与焦点管理。关键原则是优先使用原生元素，仅在必要时用ARIA增强；动态内容需通过aria-live="polite"或"assertive"告知更新，且区域须预先存在于DOM中。测试时需结合自动化工具（如Axe、Lighthouse）与手动验证，重点
-
role="img"和aria-hidden="true"一般不该一起用，因为前者声明元素是需被朗读的图像，后者却要求完全隐藏，语义冲突导致辅助技术行为不一致；纯装饰用aria-hidden="true"即可，有意义图像应配aria-label且不设aria-hidden。
-
答案：统一使用border-box盒模型，采用相对单位和现代布局技术实现响应式设计。通过设置box-sizing:border-box、使用百分比或rem等相对单位、结合Flexbox与Grid布局，并合理调整padding与margin，确保元素在不同屏幕尺寸下稳定呈现，避免溢出和计算偏差，提升响应式布局的灵活性与可维护性。
-
::first-letter仅对块级容器或table-cell等形成独立格式化上下文的元素生效；作用于inline元素如<span>时浏览器直接忽略，需设display:block或inline-block，并避免父级font-size:0等干扰。
-
CSS媒体查询是响应式主力，JS仅补位；应优先用matchMedia监听断点变化，避免滥用resize；ResizeObserver更精准观测元素尺寸变化，提升性能与可靠性。
-
script不加defer或async会阻塞HTML解析，导致白屏和交互延迟；推荐用defer、async、type="module"或动态import()优化加载策略。
-
答案：通过CSSAnimation和transform:scale()实现图片缩放轮播。首先构建包含多张图片的容器，设置绝对定位与隐藏溢出；利用@keyframes定义从放大1.2倍淡入至正常尺寸再淡出的动画；为每个图片项设置不同延迟的无限循环动画；可选添加:hover暂停效果，实现纯CSS、流畅且兼容的轮播展示。
-
:target是CSS伪类，用于匹配URL片段指向的元素。当用户点击锚点链接跳转时，可通过h2:target::before插入图标并高亮背景，如content:"✦";background-color:#fffacd，提升视觉反馈，适用于文档页、FAQ等场景，建议配合transition动画与SVG图标优化体验，确保目标元素有唯一id且content不为空。
-
应内联关键CSS并异步加载非关键CSS。将首屏所需样式内联至<style>标签，避免请求阻塞；其余CSS通过rel="preload"异步加载，结合构建工具如Critical自动提取关键样式，并用媒体查询分设备加载，提升渲染速度。
-
padding默认增大元素总尺寸，因在width/height外计算；启用box-sizing:border-box可使其从设定宽高中扣减，更符合直觉且利于响应式布局。
-
合理使用min-height和max-height可确保移动端布局适配性，min-height防止内容截断，如设置300px或80vh保证可读性，卡片统一高度；max-height限制过度拉伸，如弹窗设70vh避免全屏撑开，配合overflow-y:auto实现滚动；推荐使用dvh单位（如100dvh）适配键盘弹出场景，并添加vh回退以兼容旧浏览器；结合媒体查询在不同断点调整阈值，竖屏设min-height:400px，横屏设min-height:200px与max-height:500px，提升多设备体
-
margin:auto在flex容器中仅单轴生效，依赖剩余空间；无明确宽高或空间被占满时失效；稳妥居中应使用justify-content和align-items。
