Estoy trabajando en un proyecto de un sitio en HTML con DIVs y una hoja de estilos (style.css).
El proyecto tiene un menú en un DIV "menu", al hacer click en alguna opción, debería abrir el contenido en el DIV "cont". Son sólo 5 páginas, y, por tanto, 5 opciones en el menú y no he conseguido que se abra el contenido.
He intentado con algunos códigos que encontré (incluso en este sitio) de AJAX, JavaScript y Jquery.
El código de la página index.html es el siguiente:
Código HTML:
<head> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Language" content="cs"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta name="description" content="..."> <meta name="keywords" content="..."> <meta name="robots" content="index,follow,all"> <meta name="author" content="i21Mx"> <meta name="copyright" content="i21Mx"> <title>i21Mx.com</title> <link rel="stylesheet" href="style.css" type="text/css" media="screen, projection"> </head> <body> <div id="head"> <h1> i21Mx<span><a href="index.html"></a></span> </h1> <menu> <li><a href="#">Inicio</a></li> <!-- muestra la página principal --> <li><a href="#">Nosotros</a></li> <li><a href="#">Servicios</a></li> <li><a href="#">Productos</a></li> <li><a href="#">Contacto</a></li> </menu> <div id="border"> <div id="contenido"> </div> </div> <div id="down"> <p id="menu_bajo"> <a href="index.html">Inicio</a> <a href="URL">Store</a> <a href="mailto:[email protected]">Contacto</a> </p> <div style="text-align: left; font-size: 0.75em;">(C) 2010, Empresa<br> </p> </div> </div> </body> </html>
Código:
Espero realmente que alguien me pueda ayudar, pues ya he intentado varios métodos y ninguno ha funcionado, y el proyecto necesita terminarse esta semana.* { margin: 0; padding: 0; border: 0; } * body { font-family: Arial, Verdana, sans-serif; font-size: 13px; color: #9E9E9E; background: #D8D8D8; } #head { width: 761px; margin-left: auto; margin-right: auto; margin-top: 0px; } a { color: #9E9E9E; } a:hover { color: #2D86A0; } #cont { color: #393939; width: 720px; padding: 30px 20px 20px 20px;; } #cont h2 { font-style: italic; color: #6C6C6C; margin-left: 20px; padding-top:15px; } #cont p { margin-top: 10px; margin-left: 20px; } #cont ul li { list-style: none; padding-left:20px; } #down { background: url(obr/paticka.png) no-repeat #E4E4E4; padding: 15px 20px 20px 20px; width: 721px; height: 30px; font-weight: bold; } #down a { color: #458715; } #levo { color: #363636;
De antemano, gracias y saludos.