Desafio de Recapitulação
Parte da seção CSS Mastery do Journey de HTML da Coddy — lição 6 de 43.
Desafio
FácilVocê aprendeu como combinar seletores CSS usando os combinadores de descendente, filho, irmão adjacente e irmão geral. Agora é hora de colocar tudo em prática!
- Estilize todos os elementos
<p>que são filhos diretos dentro da<div>com a classe.roomsusando azul turquesa (#40e0d0). - Estilize todos os elementos
<p>que são descendentes da<div>com a classe.facilitiesusando verde espuma do mar (#2e8b57). - Estilize cada elemento
<p>que venha depois de uma<div>com bege arenoso (#f4a300).
Experimente você mesmo
<!DOCTYPE html>
<html>
<head>
<title>Recap Challenge</title>
<style>
/* Your CSS solution here */
</style>
</head>
<body>
<section>
<h1>Welcome to Paradise Resort</h1>
<div class="rooms">
<h2>Ocean View Rooms</h2>
<p>Room 101</p>
<p>Room 102</p>
</div>
<div class="facilities">
<h2>Resort Facilities</h2>
<div>
<p>Infinity Pool</p>
<p>Spa & Wellness Center</p>
</div>
<p>Beach Access</p>
</div>
<p>Beachfront Restaurant</p>
<p>Sunset Bar</p>
</section>
</body>
</html>Todas as lições de CSS Mastery
1Domínio de Seletores – Combinação
IntroduçãoSeletor de DescendenteSeletor de FilhoSeletor de Irmão AdjacenteSeletor de Irmão GeralDesafio de Recapitulação7Construa com CSS Grid
Fundamentos do GridPosicionamento de Itens com Grid-rowÁreas NomeadasDesafio de Revisão2Pseudo-classes Interativas
Pseudo-classesEfeitos de HoverEfeitos de FocoEstilos AtivosDesafio de Recapitulação