-
z-index用于控制定位元素在层叠上下文中的垂直堆叠顺序，其生效前提是元素position不为static，且层级比较仅限于同一层叠上下文中；创建层叠上下文的条件包括设置z-index、opacity<1、transform不为none等，父级上下文的层级决定子元素整体堆叠位置，子元素高z-index无法突破父级上下文限制；负z-index可将元素置于父元素背景之下但边框之上，适用于背景特效或底层交互；避免层级混乱的关键是理解层叠上下文边界、使用小数值递增、借助CSS变量统一管理，并通过开发者工具
-
通过合理使用:hover、:active和:focus伪类，可提升按钮组的交互体验与可访问性。首先定义基础样式，实现边框合并与统一风格；接着为悬停状态设置背景色变化，增强视觉反馈；再通过:active模拟按下效果，增加真实感；最后自定义:focus样式，确保键盘导航可用且美观。各状态独立响应，过渡自然，整体逻辑清晰，显著提升用户操作体验。
-
应优先在配置文件中通过theme.extend或shortcuts定义语义化按钮样式，而非在HTML中堆砌原子class；Tailwind用theme.extend.colors/spacing/borderRadius，Bootstrap5重写SCSS变量，UnoCSS用shortcuts+theme.colors；生效前需重启服务、核对class名与插件启用、确保CSS加载顺序及变量引用正确。
-
要让div出现水平滚动条，必须确保内容真正超宽：设容器宽度+overflow-x:auto，子元素单行排列（white-space:nowrap或flex-nowrap），禁用flex-shrink和自适应宽度；overflow-x:scroll会强制显示空滚动条，应优先用auto；Flex容器需设flex-wrap:nowrap、子项flex:00auto；移动端需加touch-action:pan-y以支持手指拖拽。
-
scale动画必须配合transform属性生效，正确写法为transform:scale(1.2)；需用transform-origin调整缩放原点；配合will-change:transform可提升性能；在flex/grid中应加translateZ(0)隔离图层。
-
JavaScript中的类型转换分为隐式和显式两类：隐式由引擎自动触发（如==、+运算），规则复杂易出错；显式由开发者明确调用（如Number()、String()），意图清晰、可控性强；推荐优先使用===和显式转换以提升代码安全性与可维护性。
-
答案：通过设置HTTP缓存头、文件版本控制、HTMLmeta标签、动态生成页面及JavaScript检测更新等方法，可有效解决浏览器缓存导致的网页内容未及时更新问题。
-
使用CSS的background-clip:text结合linear-gradient可实现渐变文字，需设置背景为线性渐变、文字颜色透明，并添加-webkit-background-clip兼容处理，通过调整方向、颜色和字体优化效果。
-
本文介绍如何利用window.matchMedia()配合resize事件，实现在浏览器窗口尺寸变化时实时动态更新iframe的加载内容，避免手动刷新才能生效的问题。
-
IE11对HTML5video支持不完整：仅支持MP4/H.264+AAC，需显式声明type="video/mp4"；动态设置src后须等待loadedmetadata事件再play()；需检查canPlayType()并启用video.js等兼容方案。
-
relative定位以元素自身原始位置为基准，通过position:relative配合top/right/bottom/left实现偏移，元素仍占文档流空间，不依赖父容器定位。
-
HTML空格字符非响应式，需用CSS的margin、padding、gap或ch/em/rem单位实现响应式间距；语义空格应结合white-space和clamp()控制；布局空格必须转为CSS处理。
-
答案：实现“回到顶部”功能需HTML添加按钮、CSS设置样式与定位、JavaScript控制显示与滚动。设计时应考虑触发时机、位置样式、可访问性及平滑滚动体验。兼容性方面需处理老旧浏览器降级、移动端触摸区域与无障碍支持，可通过特性检测和prefers-reduced-motion适配用户偏好，确保多环境正常运行。
-
本文介绍如何在Webpack5中通过多入口配置与HtmlWebpackPlugin精确控制不同HTML文件所加载的JS资源，实现“1.html加载main.js和123.js，2.html仅加载main.js”的按需打包需求。
-
应为每行表单项（如.form-row）设display:flex，label固定宽度+flex-shrink:0，input用flex:1+min-width:0；Grid布局更稳但需注意老版Safari兼容性；避免float/inline-block因设计逻辑不适用表单对齐。
