-
animation-direction支持哪些取值？animation-direction控制单次循环内关键帧的执行顺序，不是“让整个动画倒着播”，而是决定每一遍循环里@keyframes是正向走还是反向走。它有四个合法值：normal、reverse、alternate、alternate-reverse。其中normal是默认值，容易被忽略——如果你没显式设置，动画永远从0%走到100%。reverse：每遍都从100%倒着走到0%，视觉上像“倒放”，但时间轴仍是正向推
-
Flexbox是一维布局，适合组件级排列，如导航栏或按钮组；Grid是二维布局，适合页面级设计，如仪表盘或复杂网格。1.Flexbox沿主轴排列元素，适用于动态内容；Grid可定义行列和区域，实现精确控制。2.Flexbox用于按钮对齐、等高列；Grid用于侧边栏布局、模块化界面。3.Flexbox依赖流动排列，通过justify-content和align-items控制对齐；Grid使用grid-column、grid-row定位，支持命名区域。4.Flexbox通过flex-wrap换行适应屏幕；G
-
:first-child和:last-child不生效是因为它们只匹配父元素的第一个/最后一个子节点，不区分类型；若首个子节点是注释或空格文本，则li:first-child不触发。
-
HTML5manifest已被弃用，ServiceWorker+CacheAPI是唯一可靠离线方案；manifest缓存逻辑不透明、失败即全崩、无运行时控制，Chrome94+等主流浏览器已移除支持。
-
CSS的min()和max()函数通过动态选择最小或最大值实现响应式布局，减少媒体查询依赖。例如，width:min(90%,1200px)使容器宽度在小屏幕取90%，大屏幕上限1200px；font-size:max(16px,1.2vw)确保字体不小于16px且可随视口放大。两者结合CSS变量可集中管理设计系统，提升维护性与灵活性，同时保持性能高效。
-
模块联邦通过配置expose、remotes和shared实现跨应用模块共享。Remote应用暴露模块，Host应用动态导入并加载远程模块，同时共享依赖避免重复引入，运行时动态解析与加载，支持微前端独立构建与集成。
-
JavaScript模块需在模块上下文中运行，import/export是静态声明且仅限顶层作用域，动态导入用import()；默认导出与命名导出语法不同，混用需注意大括号；浏览器本地文件协议限制需HTTP服务解决。
-
本文介绍如何根据一个键名数组（如['yellow','blue']），从对象数组中精准筛选并重构每个对象，仅保留匹配的属性，同时保持原始结构清晰、可读性强。
-
子元素占比不正确源于未理解flex-grow、flex-shrink与flex-basis协作逻辑；flex-basis是分配剩余空间前的初始尺寸，设为0才能使grow按比例生效；grow瓜分的是剩余空间而非总宽，shrink在溢出时按basis×shrink加权收缩；常用组合如等宽三列用flex:110。
-
首先确保HTML文件正确引用JS并保存在手机本地，使用浏览器打开时需检查路径与权限；若无法加载，应通过KSWEB等本地服务器部署，或使用Dcoder等支持运行的APP；同时避免使用不兼容的ES6+语法，推荐用相对路径引入JS文件，并通过console.log验证执行。
-
background-attachment:fixed失效是规范行为而非bug，因其固定参照物为视口而非父容器；在滚动容器、transform/will-change触发层叠上下文或iOSSafari中易退化为scroll；可用伪元素+position:fixed模拟，或改挂html元素并设全高防塌陷。
-
火车头导出HTML空白或乱码的根本原因是编码不一致或资源路径未处理；需勾选自动识别编码、统一保存路径为英文、配合wget或脚本下载并替换资源路径。
-
Outlook对CSS支持极弱，不识别:nth-child()、相邻兄弟选择器等现代伪类和组合器；唯一可靠方案是为最后一行显式添加HTMLclass，并通过纯class选择器定义样式。
-
用display:flex最稳，父容器设display:flex并加gap控制间距，子元素设flex:1实现四宫格等宽；display:grid更灵活，用grid-template-columns:repeat(4,1fr)+gap即可，支持跨列和响应式断点。
-
移动端input默认不占满父容器，需显式设置width:100%并配合box-sizing:border-box；注意软键盘缩放、字体继承及真机测试。
