¿Cómo Abrir una Página HTML Dentro de un DIV?

Abrir página HTML dentro de DIV?

Tenemos una página dividida por varios <div> cada uno creado con su id o class, para abrir la página HTML dentro de un DIV por ejemplo en el principal, creamos un iframe dentro asignándole un nombre por ejemplo name="formularios" para utilizar en el enlace de menu donde realizaremos la llamada de la página con el parámetro TARGET.

Lo he trabajado de esta manera:

Supongamos que el siguiente código hace uso del archivo index.html, y también tres páginas más:

principal.html

ejercicio1.html

ejercicio2.html

Al cargar la página index.html en el DIV principal se mostrará por defecto la pagina principal.html, pero al hacer clic en los enlaces del menu, mostramos las páginas ejercicio1.html ó ejercicio2.html siempre en el DIV principal.

Eso se logra con el iframe y referenciandolo con:

target = "formularios"

 

El código es solo un segmento del archivo index.html

<div class="encabezado">

<img src="img-encabezado.png" alt="image" height="100px" width="1152px">

</div>

 

<div class="contenido">

              <div class="menu">

              <ul>

              <li><a href="ejercicio1.html" target="formularios">Ejercicio1</a></li>

              </ul>  

              <ul>

              <li><a href="ejercicio2.html" target="formularios">Ejercicio1</a></li>

              </ul>  

              </div>

   

              <div class="principal">

              <h2>Div de contenido, aqui se mostraran las paginas HTML</h2>

<iframe src="principal.html" style="width: 90%; height: 80%" name="formularios"></iframe>

              </div>

</div>

Ejemplo de Plantilla con CSS y Formularios HTML con PHP

 

Mi plantilla de ejemplo, un poco mas desarrollado que el mostrado en este post

También espero publicar la plantilla de ejemplo....Pero en el siguiente POST.

 http://miw2012.blogspot.com/