首页
个人开发
工作相关
搜索
登录
搜索
colo
欲买桂花同载酒
累计撰写
1823
篇文章
累计收到
0
条评论
首页
栏目
首页
个人开发
工作相关
CSS/SCSS
2025-12-12
实现高性能的响应式网格系统,支持动态主题切换和嵌套子网格
核心实现要点:使用CSS Grid的repeat()、minmax()和auto-fit构建自适应网格通过SCSS混入封装断点逻辑,避免媒体查询重复用CSS变量实现动态主题切换嵌套网格使用subgrid(有限支持)或嵌套Grid容器优化渲染性能:避免强制同步布局、使用will-change和contain: layout
2025年-12月-12日
5 阅读
0 评论
CSS/SCSS
2025-12-12
实现高性能的CSS瀑布流布局并解决图片加载导致的布局抖动问题
实现要点:使用CSS Grid的grid-template-columns和grid-auto-rows创建自适应网格通过aspect-ratio或padding技巧维护图片容器比例使用::before伪元素占位防止布局抖动应用object-fit: cover保持图片比例结合minmax()和repeat(auto-fill)实现响应式列数
2025年-12月-12日
4 阅读
0 评论
CSS/SCSS
2025-12-12
理解CSS盒模型与box-sizing属性
CSS盒模型由内容区(content)、内边距(padding)、边框(border)、外边距(margin)组成。关键点:标准盒模型:元素宽度 = content宽度box-sizing: border-box:元素宽度 = content + padding + border推荐全局使用:* { box-sizing: border-box; }
2025年-12月-12日
4 阅读
0 评论
CSS/SCSS