竖向步骤条的css代码

以下是一个简单的竖向步骤条的CSS代码示例，可根据自己的需求进行修改和定制。

/* 竖向步骤条 */
.step-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.step {
  position: relative;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #ccc;
  margin-bottom: 20px;
}

.step.active {
  background-color: #007bff;
}

.step::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 9px;
  width: 2px;
  height: calc(100% - 20px);
  background-color: #ccc;
}

.step.active::before {
  background-color: #007bff;
}

.step:first-child::before {
  display: none;
}
``