vuepress-theme-plume/article/30995vcd/index.md

url

url
/article/30995vcd/index.md

单列照片

<ImageCard v-for="item in list" :key="item.image" v-bind="item" />

双列照片

<CardGrid cols="2">
  <ImageCard v-for="item in list" :key="item.image" v-bind="item" />
</CardGrid>

三列照片

<CardGrid cols="3">
  <ImageCard v-for="item in list" :key="item.image" v-bind="item" />
</CardGrid>

不同尺寸设备适配

调整窗口大小以观察效果

<CardGrid :cols="{ sm: 2, md: 3, lg: 3 }">
  <ImageCard v-for="item in list" :key="item.image" v-bind="item" />
</CardGrid>