el-calendar如何修改每个格子间的间距

要修改 el-calendar 组件中每个格子之间的间距，你可以使用 CSS 来调整它们的外边距（margin）或内边距（padding）。这样可以改变格子之间的间隔。

首先，你需要为 el-calendar 组件添加一个自定义类名，例如 "custom-calendar"，然后在你的 CSS 文件中定义该类名的样式。

在模板中为 el-calendar 组件添加自定义类名的代码如下：

<el-calendar class="custom-calendar"></el-calendar>

接下来，在你的 CSS 文件中，你可以使用以下代码来调整格子之间的间距：

.custom-calendar .el-calendar__item {
  margin: 5px; /* 调整外边距 */
  padding: 5px; /* 调整内边距 */
}

在上面的代码中，`.custom-calendar` 是你为 el-calendar 组件添加的自定义类名，`.el-calendar__item` 是每个格子的默认类名。你可以根据需要调整 `margin` 和 `padding` 的值来改变格子之间的间距。

例如，如果你想要将格子之间的间距设置为 10 像素，可以使用以下代码：

.custom-calendar .el-calendar__item {
  margin: 10px;
}

这样就可以修改 el-calendar 组件中每个格子之间的间距了。记得在使用自定义类名和修改样式时，要确保 CSS 文件能够正确加载，并且优先级正确。