javascript - fullcalendar 两类制日历，着色周

Question

已结束。此问题正在寻求书籍、工具、软件库等的推荐。它不满足 Stack Overflow guidelines 。目前不接受答案。

---

我们不允许提出寻求书籍、工具、软件库等推荐的问题。您可以编辑问题，以便用事实和引文来回答。

已关闭 3 年前。

Improve this question

在fullcalendar中是否可以制作双色日历，奇数周为x颜色，偶数周为y颜色？

https://fullcalendar.io/#demos

像这样:

Answer 1

据我所知，FC 的 html 结构中有类似的内容:

<div class="fc-day-grid">
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
  <!-- other similar blocks of weeks-rows like above -->
</div>

您可以自定义 fc-day-grid 的每个偶数子级的 fc-bg 类，例如

.fc-row:nth-child(even) .fc-bg {
  background-color: #fcf8e3;
}

查看代码片段中的示例。

.fc-day-grid .fc-bg {
  height: 50px;
  border: solid 1px black
}

.fc-row:nth-child(even) .fc-bg {
  background-color: #fcf8e3;
}

<div class="fc-day-grid">
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
  <div class="fc-row fc-week">
    <div class="fc-bg">
      <!-- other fc elements-->
    </div>
  </div>
</div>