-
scroll-behavior:smooth未生效最常见原因是未作用于实际滚动容器，而误设在html或body上；其次不支持内联样式，且旧版Safari不兼容。
-
hsla()的a参数仅控制颜色自身透明度，取值范围为0–1，按混合公式“当前颜色×a+背景颜色×(1−a)”与背景叠加，不影响子元素；而opacity作用于整个渲染层。
-
防抖是事件停止触发一段时间后执行一次，适合搜索输入等只关心最终结果的场景；节流是固定时间间隔最多执行一次，适合滚动监听等需稳定节奏的场景。
-
图片左滑入场需用@keyframes定义translateX(-100%)到translateX(0)，绑定animation并加forwards，确保初始位置在视口左外侧且样式权重足够。
-
答案：margin和padding是CSS盒模型中控制布局的核心属性，padding指内容与边框间的内边距，影响元素内部空间且背景可延伸；margin指边框与其他元素间的外边距，创造外部间隔但不增加元素尺寸。两者在响应式设计中通过相对单位和媒体查询实现自适应，配合box-sizing:border-box可避免布局溢出。垂直方向的margin会发生折叠，需通过添加border、padding或创建BFC等方式避免。实际开发中应利用开发者工具调试，建立统一间距规范，使用CSS变量提升维护性，并优先采用简写属
-
JavaScript在==、+、!、if判断、&&、||等场景下会按抽象操作规范自动类型转换，这是语言设计而非bug，但易导致非直觉结果，应显式控制类型避免陷阱。
-
transition无效的主因是hover前后属性类型不匹配：需确保属性名一致、值类型可插值（如颜色/长度/opacity）、初始值非auto/unset，且避免使用display/visibility等不可过渡属性。
-
支持transition-property的是可动画化（animatable）CSS属性，如color、opacity、transform、width等；display、position、font-family等不可动画化属性无效；需查MDN的「Animatable」字段确认。
-
word-break和overflow-wrap触发条件不同：前者暴力拆词，后者礼貌换行；中文场景推荐overflow-wrap:break-word+word-break:keep-all。
-
Vue通过VueRouter实现真正的单页应用（SPA），无需刷新或切换HTML文件即可动态切换不同布局的“页面”，所有视图均在index.html内按需渲染，保持Vue实例统一、状态可控、体验流畅。
-
rgba渐变中alpha仅作用于颜色自身而非视觉透明度，需固定RGB、仅调alpha以突出透明度变化，避免混用transparent，结合backdrop-filter或伪元素实现精准透出效果。
-
答案：通过GeolocationAPI可获取用户位置，但需用户授权并重视隐私保护。使用getCurrentPosition()或watchPosition()获取经纬度及精度、速度、方向等数据，提升地图应用体验；而赢得用户信任的关键在于透明告知、最小化收集、提供控制权和保障数据安全，确保合规与尊重用户隐私。
-
Symbol.iterator用于同步遍历，需返回具有next方法的迭代器对象，支持for...of循环；Symbol.asyncIterator用于异步遍历，返回Promise形式的{value,done}结果，支持forawait...of循环。
-
JavaScript解构赋值是基于模式匹配的变量声明机制，支持数组/对象嵌套、剩余元素、默认值及重命名，但需注意键名精确匹配、null/undefined校验及过度嵌套风险。
-
图片在CSS网格中拉伸变形的主因是容器尺寸固定而图片未受控缩放，解决关键是用object-fit控制缩放方式，并确保父容器尺寸合理、图片自身不被错误设宽高。
