本文 没有署名，并且在一个比这个网站更奇怪的网站上，但我感谢这里的技巧。 七列网格可以快速创建日历布局。 您可以让日期（网格项）自然地落在上面，除了使用 grid-column-start 将第一天踢到正确的第一个列。
想法
- 我会选择
<ol>而不是<ul>，因为看起来日期肯定是有序的。 - 日期作为列表并不真正困扰我，因为也许这对于日历的内容来说是有语义意义的（假设它有一些内容）。
- 但是…看到一周中的日期标题作为同一列表中的第一个项目感觉很奇怪。 几乎就像它应该是单独的列表一样。
- 或者，也许它应该全部只是一个
<table>，因为它有点表格数据（有道理的是，你可能想交叉引用并查看所有星期四或其他内容）。
无论如何，这个放置技巧很有趣。
这是我们收集的 CSS 网格入门模板 中的另一种（类似）方法。
我还没有使用过 CSS Grid，这似乎是一个很好的测试机会。 为了我的日历，我将日期移动到一个伪元素中，该元素使用
counter()自动递增它们，这样我就可以在每个日期内写入内容，而无需额外的元素来分隔它们。我还将网格偏移设为 CSS 变量，以便更容易地将相同的代码重新用于更多月份，并使用一些简单的原生 JS 为今天的日期应用额外的类，以便突出显示它。
但就像我说的… 我是 Grid 的新手，我遇到的最大“错误”是网格在较小的屏幕上如何折叠。
在台式机上看起来很棒，但一旦你达到某个断点，实际的日历元素就会受到可怕的 CSS 流问题的影响。 我尝试调整
wrapper元素以指定最大宽度，但这似乎无法解决问题。 那么，这是一个 Grid 问题，有人可以为新手解释一下，还是我错过了一些东西？你说得对 - 那是一个奇怪的特定网站。 我搜索了 Twitter，看看这个人是否透露了自己的身份，但我什么也找不到。
我喜欢互联网。
哦，天哪，我记得在 2009 年用
<
ol> 元素制作日历。 https://www.russellheimlich.com/frontend-tips/ordered-list-calendar.htm
就像过去圣诞节的幽灵。
非常棒的技巧
我有一个用于 Raspberry Pi 的电子墨水显示屏，它正在寻找一个项目，而该链接激发了我使用该技术构建一个项目的灵感： https://glitch.com/edit/#!/7-calendar-cafe
虽然 CSS 非常棒，但我最近看到了一些 a11y 人员之间的对话，他们建议实际上建议将表格用于日历。 他们的论点是日历本质上是表格数据。