Menu en página

M

MSKR

Becerro
#1
#1
Hola de nuevo.

Me gustaría de ser posible que me ayuden con un menú que quiero hacer para mi página.

El siguiente código lo conseguí en una web:
Código: 
<html>
<head>
    <title>Ejemplo</title>

    <style>
        body {background:#ccc; margin:0; padding:0;}
        .contenedor {width:980px; margin:0 auto /*esta instrucción centra el contenedor*/;}
        .cabecera {width:960px; height:120px; float:left; padding:10px; background:#e1e1e1; text-align:center;}
        .menu {width:100%; background:#000; text-align:center; float:left; color:#fff; padding:10px 0;}
        .contenidos {width:960px; height:500px /*ejemplo de tamaño, para hacerlo "flexible" dejalo en 0*/; float:left; padding:10px; background:#fff;}
        .pie {width:100%; float:left; padding:10px 0; text-align:center; background:#000; text-align:center; color:#fff;}
    </style>
</head>
<body>
    <div class="contenedor">
        <div class="cabecera">
        Cabecera
        </div>
        <div class="menu">
        Menu
        </div>
        <div class="contenidos">
        Contenidos
        </div>
        <div class="pie">
        el pie
        </div>
    </div>
</body>
</html>
Lo que yo quiero es que al hacer click en un enlace dentro del div "menu" únicamente cambie la información del div "contenidos".

Suponiendo que el código es:
Código: 
<html>
<head>
    <title>Ejemplo</title>

    <style>
        body {background:#ccc; margin:0; padding:0;}
        .contenedor {width:980px; margin:0 auto /*esta instrucción centra el contenedor*/;}
        .cabecera {width:960px; height:120px; float:left; padding:10px; background:#e1e1e1; text-align:center;}
        .menu {width:100%; background:#000; text-align:center; float:left; color:#fff; padding:10px 0;}
        .contenidos {width:960px; height:500px /*ejemplo de tamaño, para hacerlo "flexible" dejalo en 0*/; float:left; padding:10px; background:#fff;}
        .pie {width:100%; float:left; padding:10px 0; text-align:center; background:#000; text-align:center; color:#fff;}
    </style>
</head>
<body>
    <div class="contenedor">
        <div class="cabecera">
        Cabecera
        </div>
        <div class="menu">
        <a href="info.html">información adicional</a>
        </div>
        <div class="contenidos">
        Contenidos
        </div>
        <div class="pie">
        el pie
        </div>
    </div>
</body>
</html>
¿Cómo puedo hacer que se cargue la página info.html dentro del div "contenidos"?

Espero que haya explicado correctamente mi pregunta.
Muchas gracias por la ayuda.

:metal:
 
Debes iniciar sesión o registrarte para responder aquí.
Arriba