TEMA14: Marcos interiores (inline frames o iframes)
Los marcos interiores o IFRAMES nos permiten mostrar una página html directamente dentro otra.
Por supuesto a algunos autores les parece la solución de todos sus problemas y a otros, en cambio, les parece que presentan demasiados inconvenientes.
Esta etiqueta, introducida por iExplorer 3, ha sido añadida a las especificaciones de HTML en la versión 4.0. Se ve en Netscape 6 y en Opera 4 y siguientes.
LA ETIQUETA BÁSICA
Los marcos interiores o flotantes nos permiten introducir en mitad de un documento html, otro documento html, como si fuera una imagen o una tabla. Vamos a ver un ejemplo simple.
<html>
<head>
<title>colores</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor=”#FFCC99″ text=”#CC3300″ link=”#666633″ vlink=”#669999″ alink=”#FF6600″>
Vamos a ver un ejemplo estupendo de cómo se pone un iframe, exactamente en mitad de
nuestra página.<br />
<iframe src=”externo.html” width=”70%” height=”90″></iframe> <br /><br />
Y seguimos tranquilamente escribiendo en nuestra página.
</body>
</html>
ATRIBUTOS
src=”archivo”: establecemos la ubicación del archivo externo que queremos incluir.
width: Establecemos el ancho del iframe, en píxeles o en tantos por ciento.
height: Establecemos el alto del iframe, en píxeles o en tantos por ciento.
frameborder=”0″ Determinanos si queremos que tenga borde nuestro iframe o no.
marginwidth=”x” Añade un margen a los lados del iframe.
marginheight=”x” Añade un margen encima y debajo del iframe.
scrolling=”no” Establecemos si aparece o no la barra de scroll.
align=”right” Alineamos el iframe a un lado o a otro. Se comporta exactamente igual que en el caso de las imágenes, es decir cuando utilizamos align=”right|left” el texto externo se ordena a su alrededor.
hspace=”x” Establece un margen a los lados.
vspace=”x” Establece un margen encima y debajo del iframe.
NOTA: Cómo siempre, repetimos: las características visuales deben establecerse con CSS y no con HTML.
<html>
<head>
<title>IFRAME</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor=”#FFCC99″ text=”#CC3300″ link=”#666633″ vlink=”#669999″ alink=”#FF6600″>
<iframe src=”externo1.html” width=”20%” height=”100%” border=”0″ align=”left” hspace=”10″ vspace=”0″></iframe>Los marcos interiores o IFRAMES nos permiten mostrar una página html directamente dentro otra.
Por supuesto a algunos autores les parece la solución de todos sus problemas y a otros, en cambio, les parece que presentan demasiados inconvenientes.
Esta etiqueta, introducida por iExplorer 3, ha sido añadida a las especificaciones de HTML en la versión 4.0. Se ve en Netscape 6 y en Opera 4 y siguientes.
LA ETIQUETA BÁSICA
Los marcos interiores o flotantes nos permiten introducir en mitad de un documento html, otro documento html, como si fuera una imagen o una tabla. Vamos a ver un ejemplo simple.
Y seguimos tranquilamente escribiendo en nuestra página.
</body>
</html>
Ver el resultado
LOS ENLACES
Los enlaces en los iframes funcionan exactamente igual que en los frames, tal y cómo vimos en el tema 13.
Esto nos permite jugar con los distintos iframes, si incluimos varios, veamos un ejemplo. Os propongo un ejercicio. Tenéis que hacer un documento html que contenga 2 iframes, uno encima de otro. En el iframe superior tenéis que poner dos enlaces con los que controlaréis lo que sucede en el iframe inferior, imitando este efecto
Necesitaréis dos imagenes: discovinillo.jpg y vinilo2.gif
Suerte!
13 Marcos (atributos) - Indice - Fin
3 Responses to "TEMA14: Marcos interiores (inline frames o iframes)"
No entiendo bien qué quieres decir con “preinstalado”, no sé si te refieres a uno de worpress.com (como éste), si ese es el caso: No puedes. En otro caso, entras por FTP te bajas el archivo de la plantilla en la que quieras poner el iframes, modificas el código y lo vuelves a subir. Salu2
me refiero a un wordpress como este claro, que no tiene hosting propio.
Pues yo habia leido que si se podia poner un iframe.
De todas formas a ver si me podeis ayudar, necesito poner un contador de cuenta atras, de los que dan los dias que quedan para tal evento. Entonces encontre uno muy chulo en springwidgets.com, que te da un codigo para wordpress, pero lo pegas en una entrada o en un widgets de texto y te borra la mitad del codigo y no funciona.
Entonces pense en un iframe desde otro servidor, pero tampoco puedo.
Alguien me puede ayudar a poner el contador ??? gracias
Leave a Reply
- Los roles en wordpress
- 2.- Estructuras de control: IF, FOR, FOR EACH, WHILE
- 9.- Insertar, cambiar y borrar datos de una tabla MySQL
- Las plantillas de Wordpress
- TEMA 12: Marcos (frames)
- TEMA14: Marcos interiores (inline frames o iframes)
- Hacer páginas Web con XHTML y CSS
- 4.- Matrices / For each
- TEMA 9: Tablas
- TEMA 5 Formato del texto
- hispanitasii: De puta madre este artículo.
- ¿Existen plantillas en WordPress que permitan gestionar las categorías como páginas? « Oficio Gráfico: [...] Jerarquía de las plantillas en WordPress [...]
- canariasmental: Magnifico post. Me has ayudao mucho, ke no conseguia encajar las p.... cajas en la pantalla si mostraba los marcadores. Gracias wapisima.
365 días
|
1 | minibasket
April 22, 2009 at 4:54 pm
como puedo poner un iframe en un blog preinstalado de wordpress ? gracias