Ex03: Traffic light

Path To follow

  1. The size of traffic light signal is 50px by 50px.
  2. The default background color of traffic light signal is #e3e3e3.

    hint 01: variables in css

    Think of CSS variables like reusable labels for colors, sizes, ...;
    They start with -- and are used with var().

    syntax.css
  3. The red lasts 15s.
  4. The orange one lasts 5s and starts at 25s.
  5. Just one keyframe, La7ya 🧔‍♂️ said so.

Trail Markings

index.html

style.css

Preview

Output