Iframe en html
¿ Qué es HTML? Estructura interna Salto de línea Párrafo Títulos Enfasis Hipervínculo a otra página Hipervínculo a otro sitio WEB Imágenes en una página Hipervínculo en una imagen Apertura de un hipervínculo en otra instancia del navegador Enlace a un correo Anclas en la misma página Anclas en la otra página Lista ordenada Lista no ordenada Lista de definiciones Listas anidadas Tablas Tabla con encabezado Tabla con título Combinación de celdas Titulo de la pagina Contenido de la cabecera Comentarios en una página Caracteres especiales Formulario form Formulario input Formulario texarea Formulario checkbox Formulario radio Formulario Select 1 Formulario Select 2 Formulario Select 3 Formulario Button Formulario Button 2 Formulario type= Formulario - input type= Formulario - agrupamiento de controles Formulario - controles con valores iniciales Formulario - orden de foco de controles Formulario - Inhabilitar controles Formulario - Text/password y maxlength Formulario - text/password/textarea y readonly Formulario - Envío de datos mediante mail Formulario - label Frames Actualización de un frame Frames - Medidas Frames - propiedades Frames - Anidamiento iframes Declaración DOCTYPE HTML Transitional DOCTYPE. HTML Estricto DOCTYPE. para Frames Validación de enlaces Conceptos hojas de estilo Texto en CSS Elementos div y span Fuentes con CSS Elementos obsoletos de html

Iframe en html

Iframe (por inline frame o marco incorporado en inglés) es un elemento HTML que permite insertar o incrustar un documento HTML dentro de un documento HTML principal. Fue introducido en el navegador Microsoft Internet Explorer en 1997 y durante mucho tiempo solo fue soportado en este navegador, la etiqueta Iframe actualmente es ya aceptada por la W3 como un elemento estándar y es ampliamente soportado por gran variedad de navegadores.

El HTML dispone de un elemento llamado iframe que permite disponer un frame con el flujo de la página, similar a disponer una imagen en la página.

Veamos un ejemplo como disponer este tipo de frame tan particular:

<html>
<head>
<title>prueba de iframes</title>
</head>
<body>
<h1>Esto es una prueba de un iframe</h1>
<iframe src="2.html" width="400" height="200">
No tiene disponible el navegador la capacidad de iframe
</iframe>
<h2>Esto ya está fuera del iframe</h2>
</body>
</html>

Como podemos ver cuando necesitamos agregar el iframe dentro de la pagina disponemos:

<iframe src="pagina2.html" width="400" height="200">
No tiene disponible el navegador la capacidad de iframe </iframe>

Le indicamos el ancho y alto que debe tomar el iframe, la ubicación continúa el flujo de la página.

La página que muestra el iframe no introduce ningn concepto nuevo:

<html> <head>
<title>prueba de iframes</title>
</head>
<body>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
<h2>Este texto está dentro del iframe.</h2>
</body>
</html>
Algunas propiedades útiles aplicables a un iframe:
  • src Archivo a mostrar dentro del iframe.
  • width Ancho en pixeles.
  • height Alto en pixeles.
  • frameborder Podemos asignarle los valores 1 o 0. Si vale 0 el borde no se muestra.
  • scrolling Los valores posibles de esta propiedad son: "auto","yes","no". Por defecto esta inicializada con el valor "auto". El valor auto significa que el navegador decide si se debe mostrar la barra de scroll. La mostrara solo si algun contenido del iframe no se ve.
    Si definimos el valor "yes" estamos indicando que siempre debe estar visible la barra de navegacion y por ultimo si asignamos el valor "no" estaremos indicando que nunca debe aparecer la barra de navegacion para dicho iframe.
  • name Nombre del iframe si queremos acceder desde otra pagina. Por ejemplo si queremos actualizar su contenido desde un enlace ubicado en otra pagina.
Ver ejemplo