HTML和CSS表格设计问题-在多个单元格中有一个div跨度？

我正在尝试设计下表（参见下面的UI设计）。然而，我似乎找不到一种方法来用HTML和CSS呈现它，因为根据从API收到的信息，工作时间可能会有所不同。因此，我不知道如何创建样式来创建一个连续的条（带阴影），并且必须调整大小。我不认为一个HTML表格会像设置一个跨单元格的值那样起作用，而这个值似乎不起作用。有什么想法吗

---

您没有发布任何您尝试过的代码，但一般来说，您可以通过在连续条顶部的时间指示中使用相同宽度的

内联块
元素来实现这一点。使用具有
位置：绝对
的div（其白色背景作为相对位置父元素/锚元素）具有相应的百分比
左
/
右
值以确定起点和终点、固定的
高度
、等于高度一半的
边框半径
、背景色
、
边框
和所需的
框影
，和
text align:center
将文本内容居中