HTML & CSS · Middle · Question 20 of 75
What does font-display: swap do in @font-face?
- 1Hides the text until the web font loads, to avoid flickering
- ✓Correct answer: Shows text in a fallback font immediately and swaps in the web font once loaded
- 3Prevents the font from loading on slow connections and in data-saver mode
Explanation
swap removes "invisible text" (FOIT): users see content in a fallback font right away, then the font changes (FOUT). This can cause a small layout shift, reduced by tuning fallback metrics (size-adjust). The optional value lets the browser skip the font entirely on a slow network.