EniunEniunEniunEniun
  • Inicio
  • Servicios
    • Desarrollo Web
    • Diseño Web
    • Marketing Digital
    • Social Media
    • Experiencia de usuario
  • Nosotros
  • Diseño de Interfaces Web
  • Blog
  • Contacto
✕
            No results See all results
            tablas de contenido en html
            Etiquetas html para crear tablas de contenido
            04/09/2019
            elementos de ordenación html5
            Elementos de ordenación
            05/09/2019

            Etiquetas html para el contenido incrustado

            contenido incrustado

            Etiquetas html para el contenido incrustado

            6. Contenido incrustado

            El contenido incrustado se utiliza para mostrar recursos externos como, por ejemplo, mapas, previsiones meteorológicas, fórmulas matemáticas, vídeos y audios, entre otros. Este método permite utilizar un servicio o interfaz de terceros.

            6.1. Etiquetas para incrustar contenido

            Algunas de las etiquetas más importantes para incrustar contenido son las siguientes:

            Tabla 6.1: Contenido incrustado
            Elemento Descripción
            <img> Representa una imagen.
            <iframe> Representa un contexto anidado de navegación, es decir, un documento HTML embebido.
            <embed> Representa un punto de integración para una aplicación o contenido interactivo externo que por lo general no es HTML.
            <object> Representa un recurso externo, que será tratado como una imagen, un sub-documento HTML o un recurso externo a ser procesado por un plugin.
            <param> Define parámetros para el uso por los plugins invocados por los elementos <object>.
            <video> Representa un vídeo, y sus archivos de audio y canciones asociadas, con la interfaz necesaria para reproducirlos.
            <audio> Representa un sonido o stream de audio.
            <source> Permite a autores especificar recursos multimedia alternativos para los elementos multimedia como  <video> o <audio>.
            <track> Permite a autores especificar una pista de texto temporizado para elementos multimedia como <video> o  <audio>.
            <canvas> Representa un área de mapa de bits en el que se pueden utilizar scripts para renderizar gráficos.
            <map> En conjunto con <area>, define un mapa de imagen.
            <area> En conjunto con  <map>, define un mapa de imagen.
            <svg> Define una imagen vectorial embebida.
            <math> Define una fórmula matemática.


            Ejemplo

            En el siguiente código se muestra cómo incrustar una imagen, un mapa de Google Maps y un vídeo de Youtube.

            <h3>Etiqueta img</h3>
            <img src="https://www.eniun.com/wp-content/uploads/eniun-icon-user-experience.svg"
                 alt="Usabilidad">
            
            <h3>Etiqueta iframe</h3>
            <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d154214.5103364689!2d-0.5427351669515812!3d38.35795447718404!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xd6235da3b9dab4b%3A0x1d7da872ac0b81e3!2sAlicante+(Alacant)%2C+Alicante%2C+Espa%C3%B1a!5e1!3m2!1ses!2sus!4v1564299065614!5m2!1ses!2sus" width="600" height="400" frameborder="0" style="border:0" allowfullscreen></iframe><br><br>
            
            <h3>Etiqueta iframe</h3>
            <iframe width="600" height="400" src="https://www.youtube.com/embed/coy5h2w5xUg" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
            

            0

            Comprueba tu aprendizaje

            Si queremos insertar una imagen en formato svg ¿podemos utilizar la etiqueta img?

            ¡Bien! ¡Has fallado!

            ¿Un iframe requiere memoria y otros recursos?

            ¡Bien! ¡Has fallado!

            El contenido del atributo alt de una imagen...

            ¡Bien! ¡Has fallado!

            HTML. Contenido incrustado
            ¡Muy bien!
            Sigue repasando...
            Compartir

            UD2. HTML

            • 1. Lenguaje de marcas HTML
            • 2. Estructura y elementos semánticos
            • 3. Contenido y texto
            • 4. Formularios
            • 5. Tablas de contenido
            • 6. Contenido incrustado
            • 7. Elementos de ordenación
            • 8. Marcadores en HTML
            • 9. Factores HTML clave para el SEO
            • 10. Test de verificación HTML y herramientas útiles
            • 11. Marcos o frames, una tecnología obsoleta
            • 12. Etiquetas HTML para acceso directo en Android e iPhone
            • 13. Metaetiquetas o metatags para redes sociales
            • 14. Cómo usar Github y SourceTree para publicar contenido
            • 15. Repositorio Git en Visual Studio Code
            • 16. Resumen HTML
            • 17. Referencias y recursos HTML

            Unidades

            • UD1. Planificación de interfaces gráficas
            • UD2. HTML
            • UD3. CSS básico
            • UD4. CSS avanzado
            • UD5. Imágenes, licencias y software de gestión
            • UD6. Sonido, vídeo y animaciones
            • UD7. Plantillas y frameworks de desarrollo
            • UD8. Integración de contenido interactivo
            • UD9. Diseño de webs accesibles
            • UD10. Usabilidad web
            • Metodología Scrum

            ENLACES

            • Nosotros
            • Contacto
            • Mapa del sitio
            • Blog

            CodePen

            codepen

            CURSOS

            • Diseño de Interfaces Web

            REDES SOCIALES

            NUESTRA MISIÓN

            Queremos que consigas tus objetivos y que tu proyecto llegue a todo el mundo de la manera más óptima. Tu éxito es nuestro deseo y pondremos en práctica toda nuestra experiencia para que lo consigas.

            Únete y recibe gratis contenido exclusivo



              © 2022 Eniun Diseño Web y Marketing Digital
              Política de privacidad y cookies
                          No results See all results