今天吃什么你说吧
有种效果用css怎么实现？
"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/bd0211095d0648870a4f06b7c5352bc7.png) 如上图红圈中布局，怎么实现 1：如果三个都存在就如"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/3d881503b1c968060cf6813e7c4ea7af.png)这样显示。 2：如果“开卡建档”不存在就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/0ee73281341c75f43323fa5d0d60daaa.png)这样显示。 3：如果“门诊充值”不存在就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/37cf379ed5ba6f79265eba0c43008124.png)这样显示。 4：如果“缴费”不存就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/2e71fb78b8b6f90f8470bfeb5cea53ad.png)这样显示。 5：如果“门诊充值”和“缴费”都不存在就"image.png" (https://wmprod.oss-cn-shanghai.aliyuncs.com/images/20241121/dbcaee2459c5d95758a51cf4ef32096f.png)这样显示。 方位不错就行，宽度不一定按画的。这样画是为了省劲儿。
希望奇迹发生_1
如何在 CSS Grid 中设置行数为 auto-fill 并使高度生效?
"image.png" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241026/106b3a1babb84944d347a6a0264b6499.png) "https://code.juejin.cn/pen/7316068943830581274" (https://link.segmentfault.com/?enc=Fcu8zTNmN2kIExhvOXmJpQ%3D%3D.DTB68oyn34TtS7vHVyXc0YYstogwpLnAjZUIOjgPoETsyIPWA5aLU%2BUev7U2Oh%2BQ) 👆 截图出自这里 ● 请问在使用 grid 布局时，如何设为行数为 auto-fill 为什么指定的高不生效？ ● 如图，第一行已经按设定显示了高度，其它几行高度不听令 ● 是不是只有在子元素 span 上设 min-height: px 才是唯一的办法 谢谢 article { margin: 20px; counter-reset: counter01; padding: 20px; background: #eee; display: grid; grid-template-columns: repeat(4, 1fr); /* 👇 指定固定行数时，设定的高度有效 */ /* grid-template-rows: repeat(5, 150px); */ /* 👇 在不指定固定行数时，设定的高度无效 */ grid-template-rows: repeat(auto-fill, min(150px, 150px)); gap: 5px; } article span{ padding: 1em; text-align: center; counter-increment: counter01; min-width: 50px; /* height: 50px; */ border: solid 1px blue; &::after{ content: counter(counter01); } } 能使行数为 auto-fill 时也让高度听指挥吗？ 谢谢
小青梅
css grid 布局如何实现第一排3个第二排3个的效果？
效果如图： "98351703035526_.pic.jpg" (https://wmlx-new-image.oss-cn-shanghai.aliyuncs.com/images/20241028/1aca068ccd57f62238e114af14e5d57a.png) 我是用两个 gird 写的，有没有办法用一个 grid 实现，主要是第一行是三等分，导致第二行grid area不好写。