HTML part

// Only one container is needed for the structure part

The CSS part

  box-sizing: border-box;
}

body {
  background-color: darksalmon;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  margin: 0;
  text-align: center;
  color: #ffff;
}
Copy the code

JS part

const prog = 'when you have that point of view,the world becomes your library to help you become better at your craft . '; let index = 1; // Use the slice method with two arguments, the first to start and the second to end. function writeText() { text.innerText = prog.slice(0, index); index++; If (index > prog. Length) {index = 1; // If (index > prog. } // Call setInterval(writeText, 300) every 0.3s;Copy the code

When you set a goal that you must achieve, the world becomes a library to help you improve your level and craft.