Как сделать смену картинок по таймеру с помощью CSS?

Question

[Ray Rouke]

Задание звучит примерно так:

Есть три картинки светофора по разному с закрашенными фонарями, нужно чтобы они через каждые 3 секунды менялись. Использовать необходимо только HTML и CSS. Кыак ента сделоть?

Answer 1

[Валентин]

через CSS animation

@keyframes trafficLight {
    0% {
        color: green;
        /* background: url(../img/pic1.png); */
    }

    50% {
        color: yellow;
        /* background: url(../img/pic2.png); */
    }

    100% {
        color: red;
       /* background: url(../img/pic3.png); */
    }
}

Answer 2

[Максим]

Как то так получилось :)
https://codepen.io/maximkisseloff/pen/ZPjVQo