55 - Pseudo-clases: only-child y only-of-type
Problema:
Confeccionar una página que muestre el empleo de las pseudo-clases only-child y only-of-type.
pagina.html
estilos.css
Ejecución de la página
<!DOCTYPE html> <html> <head> <title>Problema</title> <meta charset="UTF-8"> <link rel="StyleSheet" href="estilos.css" type="text/css"> </head> <body> <h1>Fecha de inicio.</h1> <ul id="fechainicio"> <li>10/10/2015</li> </ul> <h1>Fechas finales.</h1> <ul id="fechafin"> <li>10/12/2015</li> <li>24/12/2015</li> </ul> <div id="equipo1"> <h1>Participantes</h1> <p>Pablo Martinez.</p> </div> <div id="equipo2"> <h1>Participantes</h1> <p>Ana Luz.</p> <p>Pedro Rodriguez.</p> </div> </body> </html>
#fechainicio li:only-child { color:blue; } #fechafin li:only-child { color:blue; } #equipo1 p:only-of-type { color:red; } #equipo2 p:only-of-type { color:red; }
No tiene disponible el navegador la capacidad de iframe
Retornar