-
使用box-sizing:border-box能提升布局效率与稳定性,其将padding和border包含在元素宽高中,确保设置的width和height直观反映实际占用空间;设定width:100%并添加padding不会超出父容器,多个width:50%的元素可完美并排,避免因计算内容宽度导致的错误;在响应式布局中,配合百分比或flex布局时行为更可预测,卡片加padding仍能整齐排列,媒体查询切换更平滑;相比content-box,border-box防止padding导致的溢出问题,特别适用于表
-
需声明transition:transform0.2sease才能触发缩放动画;:active仅瞬态生效,无法保持缩放状态,持久化需JS切换class;移动端需cursor:pointer或touchstart激活。
-
JavaScript数据缓存需按需存储、合理淘汰、安全读写:内存缓存用Map+时间戳+LRU;localStorage需序列化、加版本号、禁存敏感信息;IndexedDB和CacheAPI适用于大容量或离线场景;策略应匹配业务节奏,注重一致性与隔离性。
-
用百分比padding-bottom可保持图片卡片宽高比,因其值按父容器宽度计算,配合绝对定位图片实现响应式缩放,兼容性优于aspect-ratio。
-
window.print()需确保DOM完全渲染后再调用,配合@mediaprint隔离样式,PDF导出需替代方案,分页控制须注意元素显示类型与浏览器兼容性。
-
@import不适合管理大型项目核心变量,因其同步阻塞加载、无法被预处理器识别变量作用域,导致变量不可复用、覆盖混乱及构建问题。
-
FileReader是浏览器提供的用于异步读取文件内容的API,支持将File或Blob对象读取为文本、DataURL或ArrayBuffer格式;常用于图片预览、大文件分片上传等场景。通过readAsDataURL可实现上传前预览,结合Blob.slice可进行文件分片,利用URL.createObjectURL可生成临时预览链接,使用后需调用revokeObjectURL释放内存;注意读取为异步操作,不能直接访问文件路径,且单个FileReader实例只能同时处理一个任务。
-
合理使用font-weight和text-decoration可提升文本可读性与视觉层次。font-weight控制字重,常用normal(400)和bold(700),支持100–900数值精细调节,需字体支持;text-decoration添加装饰线,如none、underline、line-through、overline,现代CSS支持样式、颜色、线型组合,如波浪红线下划线。结合两者增强信息层级,避免过度加粗,注意小字号下细体与下划线的辨识度,确保可点击元素有明确视觉提示,根据语义选择样式,提升用
-
最后一行按钮掉下来是因为末尾按钮的margin-right占用多余空间;应改用margin-left从第二个按钮开始设置,或直接使用flex布局配合justify-content或gap控制间距。
-
Gatsby构建后CSS未内联,因未在gatsby-ssr.js中实现onRenderBody函数接管HTML渲染并注入style标签;Hugo需用resources.Get+safeCSS在模板中输出编译后CSS内容。
-
HTML文件不能保存图片,只能用<img>标签引用图片;路径必须匹配物理位置:同目录写“photo.jpg”,子目录写“images/photo.jpg”,禁用本地绝对路径;Python生成时需确保src路径与HTML文件相对位置正确。
-
要实现网页背景图片的水平和垂直平铺,应使用background-repeat:repeat;,它使图像在X、Y轴双向无限重复;其他值如repeat-x、repeat-y、no-repeat及多重背景可实现单向或组合平铺效果。
-
WebComponents技术栈在2025年已成熟并广泛采用,原生支持自定义元素、ShadowDOM和HTML模板,无需polyfill;性能优越,无虚拟DOM开销,适配岛屿架构,降低首屏加载成本;主流框架均支持互操作,GitHub、Salesforce等企业已大规模应用;结合ViewTransitions和CSSHoudini等新API,未来演进明确,是跨项目、跨技术栈复用的可靠选择。
-
auto-fit配合minmax()是实现响应式Grid布局最简洁高效的方式——每列最小250px、最大均分空间,屏幕缩小时自动减少列数并撑满容器,无需媒体查询或JS。
-
WebAPI是浏览器提供的接口而非JavaScript本身特性,由浏览器用C++/Rust实现并注入全局作用域;fetch、localStorage等在Node.js中不可用,因无DOM和默认禁用;调用失败常因忽略cookies策略、存储限制、后台降频等约束;浏览器实现差异需查caniuse或特性检测。