记录grid布局实现从左至右均匀布局,自动换行

  1. 均匀布局,去掉右侧空白
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr))
    tailwindcss写法: grid gap-10px grid-cols-[repeat(auto-fit,minmax(200px,1fr))]
 display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-gap: 10px 20px;
  grid-auto-rows: 50px;
  1. 固定列宽度,改变列数量
    grid-template-columns: repeat(auto-fit, 200px)
grid-template-columns: repeat(auto-fit, 200px);
  grid-gap: 10px 20px;
  grid-auto-rows: 50px;

你可能感兴趣的:(javascript,前端,css)