-
嵌套Grid必须显式声明display:grid,子元素不会继承父级网格能力;grid-area和grid-template-areas作用域仅限直接父容器;fr单位基于当前容器尺寸计算;IE11不支持嵌套Grid且无降级方案。
-
IndexedDB是HTML5的浏览器端NoSQL数据库,用于存储大量结构化数据。通过open创建或打开数据库,在onupgradeneeded中定义对象仓库和索引;使用readwrite事务添加、更新、删除数据,readonly事务读取或遍历数据;支持主键操作与索引查询,适合离线应用持久化存储,实际开发可结合localForage等库简化API操作。
-
tabindex属性用于控制HTML元素是否可通过Tab键获得焦点及顺序。tabindex="0"使元素按文档流顺序可聚焦,适用于自定义控件;tabindex="-1"禁用Tab键聚焦但允许程序调用focus()方法;tabindex="N"(正整数)会打破默认顺序,应避免使用。正确使用tabindex能提升键盘导航体验,确保无障碍访问。开发中应优先使用语义化HTML,仅在必要时使用tabindex,结合ARIA属性,并进行完整键盘测试。
-
HTML5音频异常主因是文件编码、浏览器策略或代码错误。需规范音频参数,iOS须用户手势触发播放,多源fallback需验证路径,音量控制要正确绑定事件并处理兼容性问题。
-
Tailwind的响应式前缀是预设媒体查询的原子类,非运行时JS判断;自定义断点须在配置中声明,否则不生成CSS;多断点类互不覆盖,因作用于不同@media范围;混用min/max-width会导致断点空隙或重叠。
-
使用CSSModule可避免样式冲突并保持组件样式独立,通过命名转换机制将类名局部作用域化。在React中,只需将文件命名为[name].module.css(如Button.module.css),导入后得到类名映射对象,确保样式仅作用于当前组件。全局样式仍可通过普通.css文件引入,而模块化样式需按对象方式访问。支持动态类名拼接与条件渲染,推荐结合clsx等库处理复杂逻辑。可在.module.css中使用:global定义全局样式或通过composes复用其他类,实现灵活的样机组装。命名规范清晰时,C
-
localStorage和sessionStorage仅支持字符串,存对象需JSON序列化,取值前须判空防解析null/undefined报错;更新嵌套数据需读-改-写全量覆盖;sessionStorage随tab关闭清空,localStorage长期持久化;禁存敏感信息,避免高频写入。
-
企业简介页的现代感源于克制设计:用clamp()实现平滑响应式标题、grid-template-areas明确信任要素权重、aspect-ratio锁定图片比例,舍弃冗余动画与炫技效果。
-
HTML中插入真正空格需用 实体或white-space:pre-wrap等CSS;中英文间须加空格以符合GB/T15834—2011规范,避免阅读卡顿。
-
多列布局间距不均的根源在于剩余空间分配未明确控制;应依布局类型选用justify-content:space-between(Flex需满足容器定宽、子项总宽小于容器、无flex:1等占满行为)或gap+grid-template-columns(Grid中用gap设间距,repeat(auto-fit)配合justify-content实现等距)。
-
flex能让箭头始终贴右,关键在于父容器设display:flex并用justify-content:space-between或箭头加margin-left:auto,避免flex:1误用、绝对定位及DOM节点动态增删导致的错位。
-
等比例排列图片需用aspect-ratio设父容器宽高比+object-fit控制填充方式,而非仅依赖Grid布局;cover裁剪填满,contain完整显示;小屏需clamp()或媒体查询防列崩。
-
文件上传依赖<inputtype="file">触发change事件获取FileList,需用FileReader异步读取内容并封装进FormData通过fetch上传,禁止手动设置Content-Type。
-
浮动与绝对定位本质冲突,混用会导致布局错乱、高度塌陷等问题;因absolute完全脱离文档流,会忽略float声明,应明确职责、择一使用,优先采用Flexbox或Grid等现代布局方案。
-
固定定位图像必须用position:fixed并显式设置至少两个方向偏移(如top:20px;right:30px;),配合z-index控制层级,用vw/vh或媒体查询适配响应式,图像尺寸需用max-width或object-fit保真,避免width:100%拉伸失真。