Rainbow ปิ้วๆ – CODEBOX

Rainbow ปิ้วๆ

✨ PATHIPHOL KANJANAJIT

<style>
  body{
  background:black
  }
  div:nth-child(1){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
   background-color:red;
  }
  div:nth-child(2){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
  	background-color: orange;
  }
    div:nth-child(3){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
   background-color:yellow;
  }
  div:nth-child(4){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
  	background-color: #00FF00;
  }
    div:nth-child(5){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
   background-color:skyblue;
  }
  div:nth-child(6){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
  	background-color: blue;
  }
  div:nth-child(7){
  	width: 0%;
   height: 8vh;
   margin: .1em;
   animation: widthplus 3s infinite alternate;
  	background-color: purple;
  }
  @keyframes widthplus{
    from{width: 0%;}
    to{width:100%;}
  }
</style>
<html>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
  <div>
  </div>
</html>