-
transition需状态变化触发，如:hover；@keyframes动画可自动播放。2.transition仅控制起止状态，中间过程由浏览器计算；@keyframes通过0%、50%、100%等关键帧精确控制每一阶段样式。3.transition默认单次执行，反向过渡依赖属性变化，不支持循环；@keyframes可通过animation-iteration-count设置重复次数，支持infinite循环和方向控制。4.简单交互效果如按钮悬停用transition更高效；复杂动画如加载动效、人物行走需
-
答案：通过CSS3D变换和过渡实现卡片翻转。1.构建包含前后两面的卡片结构，设置perspective和backface-visibility；2.使用transform:rotateY()控制旋转，transition添加动画；3.通过:hover或JavaScript切换类实现交互翻转，preserve-3d保持3D空间效果。
-
通过transform:translate()与transition结合，可实现鼠标悬浮时卡片平滑上移10px并轻微放大，配合阴影变化增强浮起感，提升交互体验。
-
使用grid-template-columns配合repeat(auto-fit,minmax())实现自适应导航栏：通过设置display:grid启用网格布局，repeat(auto-fit,minmax(100px,1fr))确保导航项最小宽度为100px并均分容器空间，auto-fit自动填充有效列数，结合gap控制间距；在小屏幕下可通过媒体查询将minmax最小值调整为80px，实现响应式适配，无需复杂代码即可让导航项自动换行与伸缩，是现代CSS中高效简洁的布局方案。
-
浮动提示框动画通过CSS的transition结合opacity和transform实现，1.设置初始隐藏状态，opacity:0、transform位移并配合visibility:hidden；2.hover时改为opacity:1、transform归位，visibility:visible，实现滑入+淡入效果；3.优化使用ease-out缓动、scale微调及定位精度；4.父元素设为relative确保定位正确，最终呈现轻盈流畅的浮现动画。
-
答案是调试编码解码问题需追踪字符从源头到显示的全过程，核心在于确定各环节编码一致性。首先定位乱码类型，如问号、方框或“天书”乱码，判断问题出现在文件、数据库或网页等环节；接着检查源头编码，确认文件或数据初始编码是否正确，常用工具如VSCode、Notepad++、file-i命令可识别实际编码；然后排查中间处理环节，包括数据库连接字符集、Java的InputStreamReader编码设置、HTTP响应头Content-Type中的charset等，确保每一步转换明确指定编码；再检查目标端解码方式，如浏览
-
externref允许WebAssembly直接持有和传递JavaScript对象引用，解决了类型转换、性能损耗和复杂映射的痛点，实现了Wasm与JS间高效、自然的交互。
-
使用Flexbox实现响应式两列布局高效灵活，通过display:flex、flex属性控制比例，gap设置间距，配合flex-wrap和媒体查询实现多屏适配，支持等比分配、固定加自适应及堆叠布局，简洁直观。
-
Bootstrap适合快速开发，Tailwind提供灵活定制，Bulma语义清晰，Foundation适配企业级需求，选择应基于项目特点与团队技术栈。
-
答案：使用CSS的position:fixed属性将导航栏固定在页面顶部，通过top:0使其紧贴视窗顶端，配合width:100%和z-index确保横向铺满并层级置顶，再为body设置padding-top预留导航栏空间防止内容遮挡，最后可添加box-shadow和transition优化视觉效果。
-
在表单中，:required和:optional是两个用于根据表单元素是否设置“必填”属性来应用样式的CSS伪类。它们帮助开发者通过视觉方式提示用户哪些字段必须填写，哪些是可选的。:required伪类这个伪类匹配所有设置了required属性的表单控件。也就是说，只要HTML中某个输入框有required属性，它就会被:required选中。适用于、、等表单元素常用于给必填项添加边框颜色、背景或提示符号示例：高亮必填项为红色边框input:r
-
minmax()函数可定义网格轨道的最小和最大尺寸，参数支持长度、百分比、fr单位或auto；用于grid-template-columns时能实现响应式列宽，如minmax(200px,1fr)表示最小200px、空间充足时占1份剩余空间；嵌套在repeat(auto-fit,minmax(250px,1fr))中可创建自适应等分布局；当最大值为fr时，仅在容器空间足够才生效，否则按最小值布局；使用auto作为参数可让内容决定尺寸，如minmax(auto,100px)表示由内容撑高但不超过100px。
-
手势识别通过TouchEvent获取触摸数据，利用坐标差识别滑动、长按、双击、缩放等操作；原生JS可实现轻量级交互，如通过touchstart与touchend判断滑动方向；复杂场景推荐使用Hammer.js等库提升开发效率；需注意事件冲突、阈值设定与内存管理，以优化体验与性能。
-
图片懒加载通过延迟加载非首屏图片提升性能，核心是利用IntersectionObserver或scroll事件检测图片进入视口后，将data-src赋值给src以加载真实图片，推荐使用IntersectionObserver以提升效率。
-
使用max-height结合transition实现折叠菜单动画，通过切换expanded类控制max-height从0到300px变化，配合overflow:hidden实现平滑展开收起效果。
