用JS编写，红绿灯倒计时：实现三色交通信号灯的亮灯的顺序一般为“绿-＞黄-＞红-＞绿”依次循环。亮灯时长需根据路口的实际情况等因素来考虑设置，如红灯亮为30秒，绿灯亮为35秒，黄灯亮为5秒。

CSS页面代码：

 <style>
    *{
      margin: 0;
      padding: 0;
    }
    .signal-light{
      width: 400px;
      margin: 100px auto 0;
    }
    .light{
      display: flex;
      margin: 0 auto;
      width: 140px;
      height: 500px;
      flex-direction: column;
      align-items: center;
      border-radius: 70px;
      background-color: #333;
    }
    .light div{
      width: 100px;
      height: 100px;
      margin-top: 20px;
      border-radius: 100px;
      background-color: #eee;
    }
    .light div.countdown{ 
      text-align: center;
      font-size: 48px; 
      line-height: 100px;
    }
    #red.active{
      background-color: red;
    }
    #yellow.active{
      background-color: yellow;
    }
    #green.active{
      background-color:green;
    }

HTML页面代码：

 <div class="signal-light">
    <div class="light">
      <div