29 - Creación de un menú horizontal con una lista.
Problema:
Implementar un menú horizontal con una lista.
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> <ul id="menuhorizontal"> <li><a href="http://www.google.com">Google</a></li> <li><a href="http://www.yahoo.com">Yahoo</a></li> <li><a href="http://www.bing.com">Bing</a></li> <li><a href="http://www.ask.com">Ask</a></li> </ul> </body> </html>
#menuhorizontal { margin:0; padding:0; list-style-type:none; } #menuhorizontal a { width:100px; text-decoration:none; text-align:center; color:#ff0000; background-color:#f7f8e8; padding:3px 5px; border-right:1px solid blue; display:block; } #menuhorizontal li { float:left; } #menuhorizontal a:hover { background-color:#336699; }
No tiene disponible el navegador la capacidad de iframe
Retornar