要制作时间线上的事件节点样式，可以使用 CSS 中的伪元素 ::before 或 ::after 来创建节点。具体步骤如下：
首先，需要为事件节点所在的容器元素设置 position: relative;，以便让伪元素相对于容器定位。
然后，可以使用 ::before 或 ::after 伪元素来创建节点。比如，可以使用下面的 CSS 代码来创建一个圆形节点：
.event-node::before {
content: "";
display: block;
position: absolute;
top: 50%;
left: -10px;
transform: translateY(-50%);
width: 20px;
height: 20px;
border-radius: 50%;
background-color: #ccc;
}在上面的代码中，我们使用 content: "" 来创建一个空的伪元素，并设置 display: block 让它变成块级元素。然后，使用 position: absolute 将它相对于容器进行绝对定位，使用 top: 50% 和 transform: translateY(-50%) 将它垂直居中对齐，使用 left: -10px 将它放在容器的左侧，使用 width 和 height 分别设置它的宽度和高度，使用 border-radius: 50% 将它变成圆形，使用 background-color 设置它的背景色。
接下来，可以为节点添加一些样式，比如边框、阴影、动画等。比如，可以使用下面的 CSS 代码为节点添加一个灰色的边框和一个淡灰色的背景色：
.event-node::before {
/* 上面的代码 */
border: 2px solid #ccc;
box-shadow: 0 0 5px #ccc;
transition: all 0.3s ease-in-out;
}
.event-node:hover::before {
border-color: #333;
box-shadow: 0 0 10px #333;
}在上面的代码中，我们使用 border 添加一个边框，使用 box-shadow 添加一个阴影效果，使用 transition 添加一个过渡效果。然后，使用 .event-node:hover::before 选择器和另外一组样式，为鼠标悬停在节点上时添加一个高亮效果。
最后，可以根据实际需求来调整节点的样式和布局。比如，可以通过调整 top 和 left 属性来改变节点的位置，可以通过调整 width 和 height 属性来改变节点的大小，可以通过调整 background-color 属性来改变节点的颜色等等。