PedestrianTrafficLight-stage2_3.html 837 B

1234567891011121314151617181920212223242526272829303132333435363738
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <title>Title</title>
  6. <style>
  7. #trafficLightId {
  8. width: 50px;
  9. display: flex;
  10. flex-direction: column;
  11. }
  12. .traffic-light__element {
  13. width: 100%;
  14. height: 50px;
  15. border: 4px solid black;
  16. border-radius: 50%;
  17. }
  18. .red.on {
  19. background-color: red;
  20. }
  21. .yellow.on {
  22. background-color: yellow;
  23. }
  24. .green.on {
  25. background-color: green;
  26. }
  27. </style>
  28. </head>
  29. <body>
  30. <div id="trafficLightId"></div>
  31. <button id="button" type="button">Переключить светофор</button>
  32. <script src="PedestrianTrafficLight-stage2_3.js"></script>
  33. </body>
  34. </html>