Javascript 悬停时的表填充div

所以，我正在尝试制作一个简单的交互式日历。最初我只想显示几个月，但当鼠标悬停在一个月上时，我希望显示所有单独的日子。最后，我希望能够点击每天查看当天的内容

以下是我到目前为止的情况：

html:

实现这一目标的最佳方法是什么？我刚开始使用HTML和CSS，所以我甚至不知道使用表格是否是个好主意。与我现在所拥有的不同，我希望这些天能够填满整个月的分区

我应该使用javascript/jquery而不是CSS中的鼠标悬停吗

还有，有没有一种方法可以让我用一个月的时间来计算每个月的天数，或者我需要像现在这样为每一天计算div或td

谢谢。

当.days激活并显示为display:block时，默认为100%宽。这就是块显示的工作原理

您可以通过将“显示”设置为“表格”而不是“块”来解决此问题：

.month:hover > .days {
    display: table;
}

---

对于此类范围的内容，我建议使用现有的库，如或。我感谢您的回复。我不完全确定如何解释，但日历是我计划制作的整个网站。我希望日历覆盖整个屏幕。我不认为在这里使用插件是正确的选择。FullCalendar是一个全屏插件，但我知道有时候需要自己开发。我该如何让这个表覆盖它所在的整个div？

.days {
    display: none;
    border: 1px solid;
}
.month {
    width: 24%;
    height: 150px;
    float: left;
    border: 1px solid;
    margin: -1px 0 0 -1px;
}
.month:hover > .days {
    display: block;
}

.month:hover > .days {
    display: table;
}