CSS selektory a specificita

Použijte šablonu repozitáře cviceni-selektory.

Uvidíte podobnou stránku s kontakty jako ze cvičení flexboxu. V tomto cvičení ji budeme ještě vylepšovat. Finální verze bude vypadat takto:

Contact selectors result

V první části nepoužívejte selektory podle třídy, pouze selektory typu element + kombinátory

• Každé druhé sekci nastavte bílé pozadí

• Fotografii přidejte 3px silný rámeček barvy lightblue (dejte pozor, aby se rámeček nepřidal i ikonám)

Při následujícím stylování můžete použít třídy, ale jde to i bez nich

• Nastylujte ikonu call a message tak, aby se při najetí myši zvětšila.
  • Použijte pro to vlastnost a hodnotu transform: scale(1.3)
• Na najetí myši také nastavte kurzor na pointer/ručičku (vlasnost cursor)

Bonus

Pro plynulé zvětšení si můžete najít použití CSS vlastnosti transition.