DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<style>
body{
font-size: 1.5em;
}
body{
font-size: 1.5em;
}
.menu{
list-style: none;
margin-top: 0;
margin-bottom: 0;
padding-left: 0;
display: flex;
background: #333;
}
.submenu{
display: none;
display: block;
position: absolute;
}
.submenu .submenu{
top: 0%;
left: 100%;
}
.menu-item{
position: relative;
}
.menu-item:hover{
background: rbga(0,0,0,.5);
}
.menu-item:hover .submenu{
display: block;
}
.menu-link{
color: #ddd;
text-decoration: none;
display: block;
padding: .5em 1em;
}
</style>
</body>
</html>
<nav class= "nav">
<ul class = "menu">
<li class="munu-item"><a class= "menu-link" href="#">Nosotros</a>
</li>
<li><a class="munu-item"><a class= "menu-link" href="#">Profesores</a>
</li>
<li><a class="menu-item"><a class= "menu-link" href="#">Cursos</a>
<ul class = "menu submenu">
<li class = ><a class= "munu-link" href="#">Programacion</a></li>
<li class ="munu-item"><a class= "munu-link" href="#">Diseño</a></li>
<li class ="munu-item"><a class= "munu-link" href="#">Emprendimiento</a>
<ul class =<"menu submenu">
<li class="munu-item"><a class= "munu-item" href="#">Gestion De Proyectos web</a></li>
<li class="munu-item"> <a class= "munu-item" href="#">Taller de Emprendimiento</a></li>
</ul>
</ul>
</li>
<li><a class="munu-item"><a class= "menu-link"href="#">Blog</a></li>
</li>
<li><a class="munu-item"><a class= "menu-link"href="#">Suscribete</a>
</li>
</nav>
</ul>