justify-items 未生效的主因是容器未设 display: grid/inline-grid它仅作用于直系网格项受 min-width、justify-self 和绝对定位等限制且 IE11 不支持。justify-items 设置后项目没填满单元格检查 display 值是否为 grid很多情况下 justify-items 看似不生效根本原因是容器没真正变成 Grid 容器。它只对直接子元素grid items起作用且前提是父容器设置了 display: grid 或 display: inline-grid。如果父容器是 display: flex 或 display: blockjustify-items 完全被忽略如果用了 display: subgrid需确认父网格已定义轨道否则行为不可靠部分旧版 Safari 对 justify-items 在 subgrid 中的支持不完整正确写法示例.container { display: grid; grid-template-columns: 1fr 1fr; justify-items: stretch; /* 默认值等效于填满 */}justify-items: stretch 不总等于“铺满”——内容自身 min-width 会干预justify-items: stretch 的实际效果是让项目在行内轴inline axis上尽可能拉伸但受制于其自身的 min-width、max-width 和内部内容的固有尺寸。文字内容带空格或长单词时white-space: nowrap 可能撑破单元格导致无法“视觉上填满”图片或按钮等替换元素默认有 min-width: auto会阻止拉伸需显式设 min-width: 0 或 width: 100%使用 justify-items: start width: 100% 在某些场景下反而更可控常见修复写法立即学习“前端免费学习笔记深入”.item img { width: 100%; min-width: 0; /* 关键解除替换元素的默认最小宽度限制 */}justify-items 与 justify-self 混用时后者优先级更高单个项目可以同时受容器级 justify-items 和自身 justify-self 控制后者会覆盖前者。这在需要局部调整时很实用但也容易误以为全局设置失效。 稿定AI 拥有线稿上色优化、图片重绘、人物姿势检测、涂鸦完善等功能