UNIDAD EDUCATIVA SANTO DOMINGO DE LOS COLORADOS
SEGUNDO BACHILLERATO
TÉCNICO INFORMÁTICA
ETIQUETA <IFRAME>
La etiqueta <iframe> (Inline Frame) se utiliza en HTML para incrustar otro documento
HTML dentro de la página actual. Es una herramienta poderosa para mostrar contenido
externo, como videos, mapas, documentos y más, sin redirigir al usuario a otra página.
Atributos Principales de <iframe>
1. Aling: Alineación horizontal del iframe con respecto a la página (bottom| left |
middle | right | top).
2. Marginheight: Margen entre el contenido del iframe y sus bordes superior e inferior
(en pixeles)
3. Marginwidth: Margen entre el contenido del iframe y sus bordes izquierdo y
derecho (en pixeles).
4. Scrolling: Especifica sis e mostrarán barras de desplazamiento en el iframe,
pudiendo tener valor auto(se mostrarán solo en caso necesario para poder hacer
scroll en el contenido del marco), no (no se mostrarán nunca)o yes (estarán siempre
visibles).
5. src
Especifica la URL del documento que se va a incrustar.
6. width y height
Definen el ancho y alto del iframe, respectivamente. Pueden ser valores en píxeles o
porcentajes.
7. frameborder
Determina si el iframe debe tener un borde. Los valores posibles son "0" (sin borde)
y "1" (con borde).
8. allowfullscreen
Permite que el iframe se muestre en pantalla completa.
9. sandbox
Aplica restricciones adicionales al contenido del iframe, mejorando la seguridad.
Puede tener varios valores como "allow-scripts", "allow-same-origin", etc.
o Ejemplo: <iframe sandbox="allow-scripts"
src="https://www.example.com"></iframe>
La etiqueta <iframe> es una herramienta versátil en HTML que permite incrustar contenido
externo de manera eficiente. Conociendo y utilizando sus atributos correctamente, se puede
mejorar la funcionalidad y la seguridad de las páginas web.
Copie la información al cuaderno de materia y transcriba el siguiente código y ejecute,
capturando pantalla del código y la ejecución (Cambie los links que están en negrita /
Al finalizar todo al cuaderno de Prácticas)
Código HTML
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contenido Embebido</title>
</head>
<body>
<h1>Contenido Embebido</h1>
<h2>Escriba sus nombre completos</h2>
<h2>Video de YouTube</h2>
<iframe width="560" height="315"
src="https://www.youtube.com/embed/Zv9J83nwJfU?si=7K4XeJNcHKfH2ISP"
title="YouTube video player" frameborder="0" allow="accelerometer; autoplay;
clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
<h2>Video de Facebook</h2>
<iframe src="https://www.facebook.com/plugins/video.php?href=VIDEO_URL"
width="560" height="315" style="border:none;overflow:hidden" scrolling="no"
frameborder="0" allowfullscreen="true" allow="autoplay; clipboard-write;
encrypted-media; picture-in-picture" allowFullScreen="true"></iframe>
<h2>Videojuego</h2>
<iframe src="https://example.com/game" width="800" height="600"
frameborder="0" allowfullscreen></iframe>
</body>
</html>
TAREA
Realizar una página web sobre un tema libre, ejemplo (La tecnología), que contenga párrafos
sobre el tema, 1 tabla de información (Tipos de tecnología), 1 video y 1 videojuego
relacionado al tema. La página debe tener estilos tanto en el texto como en la tabla y un color
de fondo.
Fecha de entrega: Lunes 13 de enero 2025.
