Workshop › Traffic light › Step 7 of 12

Turn them off

What we are doing

A real traffic light shows one lamp at a time. First we dim them all with opacity.

```css
opacity: 0.25;
```

What it means

• opacity goes from 1 (fully visible) to 0 (invisible). 0.25 is a quarter: a dim lamp.

Your turn

Add the line inside .lamp, under background.

Skills: Styling with CSS

← Red, yellow, green A timeline for a lamp →

All steps

1. An empty box
2. Give the box a shape
3. Three lamps inside
4. Round lamps
5. Stack them in the middle
6. Red, yellow, green
7. Turn them off
8. A timeline for a lamp
9. Play the timeline
10. One after another
11. One setting for the speed
12. Build it yourself: a pole