Descripcion CSS:
<html>
<head><title>Portal web - aprenderaprogramar.com</title> <meta charset="utf-8">
<style type="text/css">
/*Curso CSS aprenderaprogramar.com*/
#nav-menu ul {font-family: sans-serif; list-style: none; padding:0;margin:0;}
/* Define la familia tipografica de la lista ul, elimina los símbolos de viñeta y ubica la lista con margenes externos e internos en 0px*/
#nav-menu li {float: left;margin: 0.0.15em; border: 5px groove #FFAA33 ;}
/* Cada etiqueda li se situara de manera horizontal (una a lado de la otra), define margen externo (laterales, arriba y abajo) , el estilo, grosor y color del borde. de las etiquetas*/
#nav-menu li a { background-color: #FFC0CB; height: 2em; line-height: 2em; float: left;
width: 9em; display: block; border: 0.1em solid #dcdce9; color: #0d2474; text-decoration: none; text-align: center;}
/*Define el color de cada link, su altura, y el espacio entre lineas (lo cual se podria mencionar como el margen top a partir del cual se posiciona el texto interno), situa los links de manera horizontal, define largo, hace que el elemento se muestre como caja block, deine borde, estilo y color del mismo, quita la decoracion (el subrayado de todo link) y situa el texto en el centro de la caja*/
#nav-menu li a:hover {background-color: #FF6347; }
/*al pasar el mouse por el link modifica el color original*/
</style>
</head>
Descripcion HTML
<body>
<div id="nav-menu">
<ul id="navlist"><li id="active"><a href="http://aprenderaprogramar.com" id="current">Inicio</a></li>
<li><a href="http://aprenderaprogramar.com">Cursos</a></li>
<li><a href="http://aprenderaprogramar.com">Libros</a></li>
<li><a href="http://aprenderaprogramar.com">Divulgación</a></li>
<li><a href="http://aprenderaprogramar.com">Humor</a></li>
</ul>
</div>
<!-- Define un div con id “nav-menu”, dentro del mismo se realiza una lista ul con id “navlist”, el primer li con id “active” y link hacia vuestra pagina. Lo mismo en los demas “li” pero id.-->
</body>
</html>
Tema: Menú horizontal CSS o vertical qué significa nav-menu ul color de links CU01049D (Leído 3406 veces)
RSS -
WAP2