编写水平时间轴的样式可以使用HTML和CSS来实现。下面是一个简单的示例代码：

HTML代码：

  

    
2022-01-01
    
事件1
  
  

    
2022-02-01
    
事件2
  
  

    
2022-03-01
    
事件3
  

CSS代码：

.timeline {
  position: relative;
  margin: 20px 0;
}

.timeline-item {
  position: relative;
  padding: 20px;
  border-bottom: 1px solid #ccc;
}

.timeline-date {
  font-weight: bold;
  margin-bottom: 10px;
}

.timeline-content {
  margin-left: 50px;
}

.timeline-item:before {
  content: "";
  position: absolute;
  top: 0;
  left: 25px;
  width: 2px;
  height: 100%;
  background-color: #ccc;
}

.timeline-item:first-child:before {
  top: 20px;
}

.timeline-item:last-child:before {
  height: calc(100% - 20px);
}

.timeline-item:after {
  content: "";
  position: absolute;
  top: 10px;
  left: 18px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background-color: #ccc;
  border: 2px solid #fff;
}

.timeline-item:last-child:after {
  top: calc(100% - 20px);
}

这段代码创建了一个简单的水平时间轴。每个时间轴项包含一个日期和内容。使用CSS的伪类选择器和绝对定位来创建时间轴的线条和圆点。可以根据需要修改样式，如颜色、字体大小等。