W CSS zapis z odstępem między selektorami oznacza selektor potomka (descendant selector). Reguła "h1 i { color: red; }" nie dotyczy całego nagłówka <h1>, tylko wskazuje: znajdź elementy <i> będące potomkami elementu <h1> (potomkami na dowolnym poziomie zagnieżdżenia).
Dlatego poprawne jest stwierdzenie, że czerwony kolor otrzyma tylko tekst pochylony (czyli zawartość elementu <i>) znajdujący się wewnątrz nagłówka pierwszego stopnia. Przykładowo w HTML: <h1>Tekst normalny <i>tekst pochylony</i> tekst normalny</h1> — czerwony będzie wyłącznie fragment w <i>.
Dlaczego pozostałe odpowiedzi są błędne?
- Stwierdzenie o "tekście pochylonym we wszystkich poziomach nagłówków" byłoby prawdziwe dla selektora obejmującego różne nagłówki (np. h1 i, h2 i itd.) lub dla samego "i" bez ograniczenia do <h1>. Tutaj ograniczenie do <h1> jest kluczowe.
- Opis mówiący o "całym tekście nagłówka pierwszego stopnia" pasowałby do reguły "h1 { color: red; }", ale nie do "h1 i". W selektorze potomka styl nie "rozlewa się" na rodzica.
- Twierdzenie, że czerwony będzie "cały tekst pochylony niezależnie od miejsca" odpowiadałoby selektorowi "i { color: red; }". W badanej regule element <i> musi znajdować się wewnątrz <h1>, więc kursywa w akapicie <p> nie zostanie objęta.
Wskazówka egzaminacyjna: zwracaj uwagę na spację i przecinek. Spacja oznacza relację zagnieżdżenia (potomek), a przecinek wprowadza listę niezależnych selektorów (grupowanie).
