Volver al índiceObjetos

En esta página se tratan los siguientes temas:


Insertar documentos html: <iframe>

La etiqueta <iframe> permite insertar un documento html dentro de otro. Esta etiqueta no se puede utilizar en documentos XHTML 1.0 Strict, pero sí en documentos XHTML 1.0 Transitional.

La etiqueta <iframe> puede aparecer como elemento de bloque o como elemento en-línea.

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<iframe 
  src="ejemplo_iframe.html">
</iframe>
Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<iframe 
  src="ejemplo_iframe.html"
  style="width: 400px; height: 200px;">
</iframe>

El documento puede estar en otro servidor, como en este ejemplo en el que se inserta un mapa de Google Maps:

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<iframe width="425" height="350"
    src="http://maps.google.es/maps?f=q&amp;source=s_q&amp;
         hl=es&amp;geocode=&amp;q=ies+abastos&amp;
         ie=UTF8&amp;cid=11271517402525668942&amp;
         s=AARTsJqO2-JJ63RN_BaPYqsXhy19-WrrDw&amp;
         ll=39.477148,-0.382204&amp;spn=0.023188,0.036478&amp;
         z=14&amp;iwloc=A&amp;output=embed">
</iframe>        

Volver al principio de la página


Insertar objetos: <object> y <param>

La etiqueta <object> permite insertar cualquier tipo de documentos (no solamente de texto) dentro de un documento html. Para poder mostrar esos archivos, el navegador suele necesitar plug-ins. Algunos tipos de documentos necesitan información adicional que se proporciona mediante la etiqueta <param>.

Volver al principio de la página


Ejemplos de inserción de objetos

Insertar una página web

Se puede insertar una página web en una página web mediante la etiqueta <object>, como muestra el siguiente ejemplo.

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<object
  type="text/html"
  data="ejemplo_object.html"
  style="width: 400px; height:200px;" >
  ERROR (no puede mostrarse el objeto)
</object>
ERROR (no puede mostrarse el objeto)
Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<object
  type="text/html"
  data="http://maps.google.es/maps?f=q&amp;source=s_q&amp; hl=es&amp;geocode=&amp;q=ies+abastos&amp; ie=UTF8&amp;cid=11271517402525668942&amp; s=AARTsJqO2-JJ63RN_BaPYqsXhy19-WrrDw&amp; ll=39.477148,-0.382204&amp;spn=0.023188,0.036478&amp; z=14&amp;iwloc=A&amp;output=embed"
  style="width: 425px; height:350px;" >
  ERROR (no puede mostrarse el objeto)
</object>
ERROR (no puede mostrarse el objeto)

Volver al principio de la página


Insertar un archivo flash SWF

Se puede insertar un archivo flash SWF en cualquier página web, como muestra el siguiente ejemplo.

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<object
  type="application/x-shockwave-flash" 
  data="ejemplo_flash.swf"
  style="width: 200px; height: 50px;" >
  <param name="movie" value="ejemplo_flash.swf" />
  ERROR (no puede mostrarse el objeto)
</object>
ERROR (no puede mostrarse el objeto)

Para versiones antiguas de Internet Explorer (que no respetaban las recomendaciones del W3C) era necesario utilizar etiquetas especiales, como los comentarios condicionales de Internet Explorer, que ilustra el siguiente ejemplo extraido de A list apart:

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<object
  classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"  
  style="width: 200px; height: 50px;" >
  <param name="movie" value="ejemplo_flash.swf" />
  <!--[if !IE]> <-->
    <object type="application/x-shockwave-flash"
      data="ejemplo_flash.swf"
      style="width: 200px; height: 50px;" >
      ERROR (no puede mostrarse el objeto)
    </object>
  <!--> <![endif]-->
</object>
ERROR (no puede mostrarse el objeto)

Volver al principio de la página


Insertar un vídeo de YouTube

Los vídeos de YouTube pueden obtenerse en formato Flash, por lo que se pueden insertar en una página web mediante la etiqueta <object>, como muestra el siguiente ejemplo. Para insertar otro vídeo habría que sustituir el código del vídeo en el atributo data (en el ejemplo, el código del vídeo es vZV-t3KzTpw).

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<object
  type="application/x-shockwave-flash"
  data="http://www.youtube.com/v/vZV-t3KzTpw"
  style="width: 425px; height:350px;" >
  <param name="movie"     value="http://www.youtube.com/v/vZV-t3KzTpw" />
  ERROR (no puede mostrarse el objeto)
</object>
ERROR (no puede mostrarse el objeto)

Volver al principio de la página


Insertar un archivo PDF

Se puede insertar un archivo PDF en cualquier página web, como muestra el siguiente ejemplo. Para insertar otro archivo PDF habría que indicar la URI del archivo mediante el atributo data (en el ejemplo, es simplemente ejemplo.pdf).

Correcto en Firefox Correcto en Internet Explorer Correcto en Chrome
<object
  type="application/pdf" 
  data="ejemplo.pdf"
  style="width: 400px; height: 550px;" >
  ERROR (no puede mostrarse el objeto)
</object>
ERROR (no puede mostrarse el objeto)

Volver al principio de la página

Última modificación de esta página: 20 de diciembre de 2011

Licencia de Creative Commons
Páginas web HTML / XHTML y hojas de estilo CSS por Bartolomé Sintes Marco
se distribuye bajo una Licencia Creative Commons Reconocimiento-CompartirIgual 4.0 Internacional (CC BY-SA 4.0).