Half-fade an element — practice exercise

What you'll be asked to do

1. 1.Half-fade an elementexercise · easy · 10 min

   Set #box to 50% opacity using a decimal.

   Passes when: Set #box to 50% opacity using a decimal.

2. 2.Use a percentageexercise · easy · 10 min · practice plan

   Set #box to 35% opacity using a percentage.

   Passes when: Set #box to 35% opacity using a percentage.

3. 3.Fade it out entirelyexercise · easy · 10 min · practice plan

   Make #box fully transparent but still take up space.

   Passes when: Make #box fully transparent but still take up space.

4. 4.Fade the whole groupexercise · easy · 10 min · practice plan

   Set #wrap to 0.75 so everything inside fades together.

   Passes when: Set #wrap to 0.75 so everything inside fades together.

5. 5.Fade the background onlyexercise · medium · 10 min · practice plan

   A half-transparent background with fully opaque text.

   Passes when: A half-transparent background with fully opaque text.

6. 6.Fix the value above onebug fix · easy · 8 min

   An opacity of 2 clamps to fully opaque.

   Passes when: An opacity of 2 clamps to fully opaque.

7. 7.Fix the missing percent signbug fix · easy · 8 min · practice plan

   Without a % this reads as 35, which clamps to 1.

   Passes when: Without a % this reads as 35, which clamps to 1.

8. 8.Fix visibility used to fadebug fix · easy · 8 min · practice plan

   Fading to nothing uses opacity.

   Passes when: Fading to nothing uses opacity.

9. 9.Fix the opacity on the wrong elementbug fix · easy · 8 min · practice plan

   The whole group should fade together.

   Passes when: The whole group should fade together.

10. 10.Fix the faded textbug fix · easy · 8 min · practice plan

    Only the background should be translucent, not the contents.

    Passes when: Only the background should be translucent, not the contents.

Between them these tasks cover opacity, Percentage opacity and Opacity vs alpha.

Looking for a different chapter? See every practice set, or switch to the interview theory questions.