Reguła CSS p > i { color: blue; } składa się z selektora oraz deklaracji stylu. Deklaracja color: blue zmienia kolor tekstu elementu, który został dopasowany przez selektor.
Kluczowe znaczenie ma selektor p > i:
- p oznacza element akapitu.
- > to kombinator dziecka (child combinator) – wymaga, aby drugi element był bezpośrednim dzieckiem pierwszego w drzewie DOM.
- i oznacza element i, który domyślnie bywa renderowany jako tekst pochylony.
W efekcie na niebiesko zostanie ustawiony tekst tylko tych elementów i, które są wstawione bezpośrednio wewnątrz p, np.:
<p>To jest <i>kursywa</i>.</p>
Dlaczego pozostałe odpowiedzi nie pasują?
- "cały tekst paragrafu…" jest błędne, bo selektor nie wskazuje elementu p, tylko element i wewnątrz p.
- "cały tekst nagłówków…" jest błędne, bo selektor zaczyna się od p, więc nie dotyczy nagłówków typu h1–h6.
- "pogrubiony tekst paragrafu" jest błędne, bo pogrubienie zwykle wiąże się z b/strong, a reguła dotyczy i i ustawia kolor, nie grubość fontu.
Wskazówka egzaminacyjna: gdy widzisz znak >, zawsze sprawdź relację "rodzic–dziecko bezpośrednie". To częsty punkt pułapek w zadaniach z selektorów.