Saltar al contenido principal

Ejercicio 2: Barra de navegación con css

Crea una barra de navegación horizontal con enlaces que cambian de color cuando se pasa el ratón por encima de ellos.

Solución interactiva

Solución con el código HTML y CSS completo

HTML
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<title>Ejercicio 1</title>
<style>
/* Escribe tu CSS aquí */
nav {
background-color: #333;
overflow: hidden;
}

nav a {
float: left;
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}

nav a:hover {
background-color: #ddd;
color: black;
}
</style>
</head>
<body>
<nav>
<a href="#home">Home</a>
<a href="#services">Services</a>
<a href="#contact">Contact</a>
</nav>
</body>
</html>