北京
分享至
CSS Grid 号称布局神器，但写代码像在黑暗里拼拼图——调完参数才能看到效果，错了就重来。这个痛点从2017年Grid规范落地就没人真正解决，直到上周一个独立开发者扔出了可视化 playground。
界面像调音台：8列6行上限，gap 拖到32px实时看留白，minmax() 和 1fr 的拉扯直接可视化。你拖动滑块，网格线跟着动，单元格像活字印刷的铅字重新排布。开发者说灵感来自「每次调 Grid 都要开五个浏览器标签页查文档」的暴躁日常。
同系列还有 Flexbox 版本。整个工具箱塞了300多个小玩意，从渐变生成器到正则测试，地址扔在 vercel.app 上——没融资没团队，纯个人项目。评论区有人贴了自己写的 Grid 代码，说「终于能截图给设计师解释为什么这里会崩了」。
有意思的是，这个 playground 本身是用 Tailwind 写的——那个被吐槽「让前端忘记 CSS 原生语法」的框架。作者没回避这点：「我也用工具，但工具不该遮住底层长什么样。」
特别声明：以上内容(如有图片或视频亦包括在内)为自媒体平台“网易号”用户上传并发布，本平台仅提供信息存储服务。
Notice: The content above (including the pictures and videos if any) is uploaded and posted by a user of NetEase Hao, which is a social media platform and only provides information storage services.
