Versión original creada por: Josh Duck
Traducción y edición por: Miguel Ángel López Torralba
La siguiente tabla es una ayuda de referencia rápida para conocer html5, en cada elemento aparecen varios enlaces externos donde se explican los atributos y usos de la etiqueta en profundidad (algunos de ellos en español), aparte de un pequeño código donde se ve un ejemplo del elemento en cuestión
Elemento raiz que engloba a todo el documento excepto a la declaración del mismo.
<!DOCTYPE html>
<html lang="es">
...toda la web
</html>
Se utiliza para especificar diferentes atributos a las columnas de una tabla. Esta etiqueta es muy útil para aplicar atributos a la columna entera en lugar de usar estilos en cada una de las celdas o en cada una de las filas.
<table border="1px">
<col width="100px"/>
<col width="200px"/>
<tr>
<td><b>Nombre</b></td>
<td><b>Ciudad</b></td>
</tr>
</table>
| Nombre | Ciudad |
Esta etiqueta se utiliza para definir una tabla.
<table border="1px">
<col width="100px"/>
<col width="200px"/>
<tr>
<td><b>Nombre</b></td>
<td><b>Ciudad</b></td>
</tr>
</table>
| Nombre | Ciudad |
Es el primer elemento del documento HTML, en él se declaran los metadatos, estilos, título de la página...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta></meta>
<style type="text/css"></style>
<script type="text/javascript"></script>
<base></base>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
...
</body>
</html>
Contenedor sin significado semántico, que se utiliza para dar estilos a partes de un texto
<span style="color: #00FF80;">Esto esta escrito bajo un span</span> y esta parte no
Contendor sin significado semántico, que se utiliza para hacer bloques y dotarlos de estilos determinados
<div style="background-color: #FFC20F; padding: 5px; border-radius:5px;">Esto es un Div</div>
Elemento que recuadra al resto de elementos de un formulario, haciendolo más fácil de entender para los usuarios.
<form>
<fieldset>
Nombre:
<input name="nombre" type="text">
.
.
<input type="submit" value="enviar">
<input type="reset" value="borrar">
</fieldset>
</form>
Determina los límites de un formulario que permite al usuario utilizar datos para comunicarse con la aplicación
<form>
Nombre:
<input name="nombre" type="text">
.
.
<input type="submit" value="enviar">
<input type="reset" value="borrar">
</form>
Define el cuerpo del documento, donde aparece todo lo que muestra la página, desde textos, a formularios, enlaces, imágenes...
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta></meta>
<style type="text/css"></style>
<script type="text/javascript"></script>
<base></base>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
...
</body>
</html>
Encabezamiento para la sección, debe usarse solo una vez por página, ya que sirve para el SEO y los motores de búsqueda.
<h1>Este es el encabezado</h1>
Etiqueta de sentido semántico la cual contiene elementos agrupados por un tema
<section>
<article>...</article>
<article>...</article>
<article>...</article>
</section>
Define un grupo de columnas en una tabla
<table border="1px">
<colgroup width="300px"/> </colgroup>
<tr>
<td><b>Nombre</b></td>
<td><b>Ciudad</b></td>
</tr>
</table>
| Nombre | Ciudad |
Define un fila de celdas
<table border="1px">
<colgroup width="300px"/> </colgroup>
<tr>
<td><b>Nombre</b></td>
<td><b>Ciudad</b></td>
</tr>
<tr>
<td>Museo Británico</td>
<td>Londres</td>
</tr>
</table>
| Nombre | Ciudad |
| Museo Británico | Londres |
El nombre de la página, es recomendable que cada página de nuestro sitio tenga su propio nombre, ya que ese modo ayuda a los motores de búsqueda.
Aparece en la pestala de nuestro navegador informado de la página que esta abierta, siendo una etiqueta obligatoria en HTML5
<!DOCTYPE html>
<html>
<head>
<title>Tabla periódica de los elementos HTML5</title>
<meta></meta>
<style type="text/css"></style>
<script type="text/javascript"></script>
<base></base>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
...
</body>
</html>
Hipervinculo que nos dirije a otra web, a otra sección, archivos... puede contener a otros elementos como divs, imagenes, textos...
Requiere del atributo href y si se quiere que se abra en una pestaña aparte target="_blanck"
<a href="http://mialtosite.esy.es/">Enlace a mi portfolio</a>
Indica a los navegadores que se trata de un texto preformateado, esto quiere decir que cada caracter tiene el mismo ancho, que respeta los saltos de línea y que se respetan los espacios en blanco, se suele usar para mostrar código.
<pre>
esto
es
un
texto preformteado
</pre>
esto
es
un
texto preformteado
Este elemento define una medición escalar dentro de una gama conocida, o un valor fraccionario de manera gráfica. No debe ser utilizada para indicar el progreso (como en una barra de progreso) ya que para ello se utiliza la etiqueta progress.
Los atributos que podemos utilizar para esta etiqueta son:
<p>Valor alto <meter low=10 high=20 max=30 value=23></meter></p>
<p>Valor medio <meter low=10 high=20 max=30 value=15></meter></p>
<p>Valor bajo <meter low=10 high=20 max=30 value=3></meter></p>
Valor alto
Valor medio
Valor bajo
Crea un menu desplegable, creando una opcion por cada elemento option.
<select>
<option value="html">HTML</option>
<option value="css">CSS</option>
<option value="js">JavaScript</option>
<option value="php">PHP</option>
</select>
Rodea todo aquel contenido que no es directamente contenido principal del que estamos hablando o del que estamos tratando en esa página en concreto. La norma dice que se use para todo aquel contenido tangencial al contenido principal de la página
<aside>Visite mi blog de viajes
<a href="http://explorandosenderos.wordpress.com/" target="_blank">Explorando senderos</a></aside>
Cabecera de seccion, por debajo en importancia de h1, se puede utilizar cuantas veces se necesite.
<h2>Este es el encabezado h2</h2>
Introduce una cabecera de la página, con su logotipo, posiblemente el nombre de la misma, una pequeña descripción y el menú de navegación.
No es obligatoria pero si puede ayudar a la buena formación del documento HTML y ayudar a que los buscadores la consideren mejor para mostrar.
<body>
<header>
<img src="">
<h1>Aquí viene el título de la web</h1>
Deescripción de la web
<nav>El menú de navegación</nav>
</header>
...
</body>
Introduce el nombre de una tabla. Esta etiqueta debe ir justo a continuación de la etiqueta <table>
<table border="1px">
<caption>Museos</caption>
<tr>
<td><b>Nombre</b></td>
<td><b>Ciudad</b></td>
</tr>
<tr>
<td>Museo británico</td>
<td>Londres</td>
</tr>
</table>
| Nombre | Ciudad |
| Museo británico | Londres |
Celda de una tabla.
<table border="1px">
<caption>Museos</caption>
<tr>
<td><b>Nombre</b></td>
<td><b>Ciudad</b></td>
</tr>
<tr>
<td>Museo británico</td>
<td>Londres</td>
</tr>
</table>
| Nombre | Ciudad |
| Museo británico | Londres |
Se utiliza para asignar valores a propiedades de un documento(por ej., descripción del documento, autor, palabras claves, idioma del documento, etc.). Es una de las etiquetas utilizadas para el posicionamiento.
Siempre se coloca dentro del head, y no se ve por pantalla.
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta>Aquí van los metadatos de la web</meta>
<style type="text/css"></style>
<script type="text/javascript"></script>
<base></base>
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
...
</body>
</html>
Define una explicación o la pronunciación de caracteres (para Asia Oriental tipografía)
<rt> 漢 ㄏㄢˋ <rt>
Etiqueta que se utiliza para una definición.
<dfn>Programador: </dfn> Persona que elaboraprogramas de ordenador (Segun la RAE)
Etiqueta para marcar texto con énfasis, generalmente con letra en itálica.
<em>Esto es un texto con énfasis</em> y esto no.
Escribe el texto entre la etiqueta de apertura y cierre en itálica.
<i>Esto es un texto en itálica</i> y esto no.
Sirve para escribir con un tipo de letea más pequeño
<small>Esto es un texto con letra small</small> y esto normal.
Marca de forma subrayada un texto que ha sido introducido despues de una edición.
<ins>Texto editado</ins> y texto inicial.
Salto de línea
Este texto <br>
tiene saltos <br>
de línea
Contenido de un parrafo.
<p>Esto es un párrafo</p>
<p>Esto es otro párrafo</p>
Esto es un párrafo
Esto es otro párrado
Introduce una cita larga en forma de bloque dentro de un texto.
De forma general, el navegador introduce espacios en blanco alrededor.
El incio del Quijote es:
<blockquote>En un lugar de la Mancha, de cuyo nombre no quiero acordarme,
no ha mucho tiempo que vivía un hidalgo de los de lanza en astillero,
adarga antigua, rocín flaco y galgo corredor. Una olla de algo más vaca que carnero,
salpicón las más noches, duelos y quebrantos los sábados, lantejas los viernes,
algún palomino de añadidura los domingos, consumían las tres partes de su hacienda.<blockquote>
En un lugar de la Mancha, de cuyo nombre no quiero acordarme, no ha mucho tiempo que vivía un hidalgo de los de lanza en astillero, adarga antigua, rocín flaco y galgo corredor. Una olla de algo más vaca que carnero, salpicón las más noches, duelos y quebrantos los sábados, lantejas los viernes, algún palomino de añadidura los domingos, consumían las tres partes de su hacienda.
Introduce un nombre en un fieldset.
<form>
<fieldset>
<legend>Registro</legend>
Nombre:
<input name="nombre" type="text">
.
.
<input type="submit" value="enviar">
<input type="reset" value="borrar">
</fieldset>
</form>
Grupo de opciones en un select.
<select>
<optgroup label="Lenguajesweb">
<option value="html">HTML</option>
<option value="css">CSS</option>
<option value="js">JavaScript</option>
<option value="php">PHP</option>
</optgroup>
<optgroup label="Lenguajesweb">
<option value="java">JAVA</option>
<option value="c">C</option>
</optgroup>
</select>
Sirve para marcar información sobre algo en el artículo.
<address><a href="http://es.wikipedia.org/wiki/Miguel_de_Cervantes">
>Cervantes</a><address>
Escribió el Quijote
El tercer encabezado en importancia.
<h3>Este es el encabezado h3</h3>
Representa el contenido principal del body, y puede o no contener a otros elementos como el header, el nav, footer...
<body>
<header>
...
</header>
<main>
<section>
<main>
...
</article>
...
</section>
<aside>
</aside>
</main>
<footer>
</footer>
Define una celda en el encabezado de una tabla
<table border="1px">
<colgroup width="300px"/> </colgroup>
<tr>
<th><b>Nombre</b></th>
<th><b>Ciudad</b></th>
</tr>
<tr>
<td>Museo Británico</td>
<td>Londres</td>
</tr>
</table>
| Nombre | Ciudad |
|---|---|
| Museo Británico | Londres |
Se utiliza para definir valores por defecto para todos los enlaces de una página como el target o la URL
<head>
<base target="_blank"/>
</head>
Contiene marcado sin significado semantico para navegadores que no entienden el significado de las anotaciones ruby.
<rp> 漢 ㄏㄢˋ <rp>
Etiqueta que permite colocar acrónimos.
<abbr title="Hipetext Transfer Protocol">HTTP</abbr>
Etiqueta que permite la muestra de fechas que pueda reconocer el navegador. Ya sean fechas u horas.
<time class="dtstart" datetime="2011-07-17"> 17 de Enero del 2011</time><br>
<time datetime="21:00">9pm</time><br>
<time datetime="2011-09-12">12 de Septiembre del 2011</time><br>
<time datetime="2011-09-12T13:30">12 de Septiembre del 2011 a las 1:30pm</time><br>
Sirve para colocar un texto en negrita
Esto es un texto normal <b> y esto utilizando la etiqueta <b></b>
Aplíca un énfasis fuerte, mostrandose generalmente con negrita.
Esto es un texto normal <strong> y esto utilizando la etiqueta <strong></strong>
Sirve para tachar texto, generalmente se usa para tachar algo en edición.
América se descubrió en el <del>1942</del> 1492, por Cristobal Colón
Ejemplo de input para un programa, llamar la atención del usuario ante un formulario...
<kbd>Introduzca aquí su número de socio</kbd>
Línea horizontal que separa diferentes secciones de un documento.
Sección 1
<hr>
Sección 2
<hr>
Crea una lista ordenada.
Tiene un atributo type con el que escoger algunas de las formas de ordenar la lista:
<ol type="A">
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ol>
Crea una lista de elementos con nombre y descripción, para ello requiere las etiquetas dt y dd.
<dl>
<dt>Chocolate</dt>
<dd>Elaborado a base de cacao</dd>
<dt>Caramelo</dt>
<dd>Elaborado a base de azucar</dd>
</dl>
Se utiliza para añadir información a los controles de un formulario.
Mantiene un atributo for el cual debe de tener el mismo valor que la id del elemento para que el navegador los considere asociados.
<form>
<input type="radio" name="internet" id="html" />
<label for="html">HTMLlt;/label>
<br />
<input type="radio" name="internet" id="css" />
<label for="css">CSS</label>
<br />
<input type="radio" name="internet" id="js" />
<label for="js">JavaScript</label>
</form>
Opción dentro de un select de un formulario
<select>
<option value="html">HTML</option>
<option value="css">CSS</option>
<option value="js">JavaScript</option>
<option value="php">PHP</option>
</select>
Define una lista de opciones predefinidas para una caja de texto input, proporciona un autocompletado similar al de Google Auto Suggest. El resultado es una lista desplegable con las opciones predefinidas a medida que vamos introduciendo contenido en la caja de texto.
Para unir el elemento input con la lista de elementos del datalist se utiliza en atributo list.
<form>
<label for="provincia">Provincia : </label>
<input id="nombre_prov" name="nombre_prov" type="text" list="provincias" />
<datalist id="provincias">
<option value="ALAVA">
....
</datalist>
</form>
Cuarta cabecera de sección
<h4>Este es el encabezado h4</h4>
Seccion del contenido de una página, como el post de un blog o un foro. Generalmente esta dentro de un section que puede constituirse de varios articles, pero la etiqueta article puede tener incluso sus propios headers, navs....
<section>
<article>...</article>
<article>...</article>
<article>...</article>
</section>
Esta etiqueta esta obsoleta. Se suele utilizar para introducir atajos de teclado o funcionalidades a un menu.
<menu>
<command onclick="alert('Hola Mundo')">¡Click Aqui!</command>
</menu>
se utiliza para definir una o más filas como cuerpo de tabla.
Esta etiqueta debe utilizarse en conjunto con las etiquetas thead y tfoot.
<style type="text/css">
thead {color:white;background:#069}
tbody {color:blue}
tfoot {color:white;background:orange}
</style>
</head>
<body>
<table border="1">
<thead>
<tr>
<th>Producto</th>
<th>Precio</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Total</td>
<td>$38</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Chocolate</td>
<td>$20</td>
</tr>
<tr>
<td>Dulces</td>
<td>$18</td>
</tr>
</tbody>
</table>
| Producto | Precio |
|---|---|
| Total | $38 |
| Chocolate | $20 |
| Dulces | $18 |
Define un enlace entre el documento y un recurso externo como, hojas de estilo CSS.
Siempre va incluido en el head y no tiene etiqueta de cierre.
<head>
<link rel="stylesheet" type="text/css" href="css/miestilo.css" />
</head>
Contiene información que solo se revela si los scriptins están desactivados.
<noscript>Su navegador no soporta JavaScript</noscript>
Introduce una cita dentro de un texto.
Como dijo Confucio <q>Me lo contaron y lo olvide, lo ví y lo entendí, lo hice y lo aprendí</q>
Me lo contaron y lo olvide, lo ví y lo entendí, lo hice y lo aprendí
Indica que algo es un variable, matemática o de programación.
En el siguiente problema la variable <var>impuesto añadido</var> tendrá un valor de 1.16%.
Sirve para declarar subindices.
La fórmula química del agua es: H<sub>2</sub>O
Sirve para marcar texto, sobre todo cuando hace referencia a otro lugar o incluso como resultado de búsquedas.
El título del libro al que hace referencia el texto es, <mark>Los hijos del cielo</mark>
Punto de posible ruptura de línea.
Cuando una palabra es muy grande, o cuando deseamos que una línea de texto se rompa por algún lugar específico cuando se ve en diferentes tipos de dispositivos.
estoesunapruebapararompereltextopordonde<wbr>nosotrosqueramoscuandoseacorteeltamañodelapantalladelocontrariolalíneaseajustarapordondeelnavegadorconsideresoportuno
Es una etiqueta semántica que sirve para enmarcar un titular dentro de la etiqueta figure.
<figure>
<img src="imagenes/figure.png>
<figcaption>La fuerza de HTML5</figcaption>
</figure>
Crea una lista desordenada.
<ul>
<li>HTML5</li>
<li>CSS3</li>
<li>Javascript</li>
<ul>
Termino que va a ser descrito en una lista de descripciones.
<dl>
<dt>Chocolate</dt>
<dd>Elaborado a base de cacao</dd>
<dt>Caramelo</dt>
<dd>Elaborado a base de azucar</dd>
</dl>
Se utiliza para la entrada de datos por parte del usuario en un formulario.
Entre otros atributos, tiene el denominado type que declara el tipo de dato que representa.
<form>
<fieldset>
Nombre:
<input name="nombre" type="text">
.
.
<input type="submit" value="enviar">
<input type="reset" value="borrar">
</fieldset>
</form>
Este elemento no tiene ninguna particularidad que lo distinga de un simple label. Su importancia radica en la facilidad para comunicar a robots de buscadores (o a cualquier otro tipo de interfaz capaz de interpretar HTML) que lo contenido ahí es un campo calculado cuyo valor no debería indexarse y que además se trata posiblemente del dato más importante dentro del formulario al que pertenece, ya que será el que atraiga la atención del usuario.
Esta etiqueta, nueva en html, tiene varios atributos importantes
<form name="division" onsubmit="return false" oninput="cociente.value = parseInt(dividendo.value) / parseInt(divisor.value)">
<input id="dividendo" type="number" step="any"/> :
<input id="divisor" type="number"step="any"/> =
<output name="cociente" for="dividendo divisor">
</form>
Facilita la generación de llaves, y el envío de la clave pública como parte de un formulario HTML. Este mecanismo está diseñado para utilizarse con sistemas de gestión de certificados basados en la Web. Se espera que el elemento keygen se utilice en un formulario HTML, junto con otra información necesaria para la construcción de una solicitud de certificado, y que el resultado del proceso será un certificado firmado..
El quinto tipo de encabezado.
<h5>Este es el encabezado h5</h5>
Dentro de la etiqueta details, sirve para ocultar o mostrar su interior, haciendo que sea como un resumen de lo que guarda en su interior.
Atencion!!! No todos los navegadores lo soportan todavia
<details>
<summary>Bicicleta nueva!!!</summary>
<p>Vendo bicicleta nueva por mudanza a otro país, esta en perfecto estado, precio a negociar...</p>
</details>
Vendo bicicleta nueva por mudanza a otro país, esta en perfecto estado, precio a negociar...
Contiene a las celdas de la cabecera de una tabla.
<table border="1">
<thead>
<tr>
<th>Producto</th>
<th>Precio</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Total</td>
<td>$38</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Chocolate</td>
<td>$20</td>
</tr>
<tr>
<td>Dulces</td>
<td>$18</td>
</tr>
</tbody>
</table>
| Producto | Precio |
|---|---|
| Total | $38 |
| Chocolate | $20 |
| Dulces | $18 |
Esta etiqueta sirve para definir estilos css dentro del documento, aunque lo recomendado es enlazar un archivo con el estilo aparte, puede ser útil para algunas situaciones.
<style type="text/css">
thead {color:white;background:#069}
tbody {color:blue}
tfoot {color:white;background:orange}
</style>
Sirve tanto para introducir como para enlazar scripts.
<script src="javascript.js"></script>
O este otro ejemplo:
<script>
código del script
</script>
Contiene una cita o una referencia a algun otro sitio.
<cite>El Quijote</cite> por Miguel de Cervantes.
Viene a dar la salida de un programa.
El script debe de dar como resultado: <samp>Hola Mundo!!!</samp>
Crea un superindice en el texto.
2<sup>2</sup>=4
Contienen texto sobre la anotacion y pronunciación junto con etiquetas como rt o rp, generalmente usada en el este de Asia.
<ruby>漢 ㄏㄢˋ</ruby>
La dirección de escritura del texto está relacionada con el idioma y se declara con el atributo dir. Pero en ocasiones esto no es suficiente, entonces entra en juego el elemento bdo (anulación del algoritmo bidireccional) que al anular el algoritmo permite un control total de la direccionalidad.
<p> cero(0)
<bdo dir="rtl">
<em> uno(1) dos(2) </em> tres(3) cuatro(4)
<em dir="ltr"> cinco(5) seis(6) </em> siete(7) ocho(8)
</bdo> nueve(9)
</p>
cero(0) uno(1) dos(2) tres(3) cuatro(4) cinco(5) seis(6) siete(7) ocho(8) nueve(9)
Sirve para introducir fragmentos de código.
<code>
alert("Hola Mundo!!!");
</code>
alert("Hola Mundo!!!");
Representa contenido independiente, a menudo con un título. Por lo general, se trata de una imagen, una ilustración, un diagrama, un fragmento de código, o un esquema al que se hace referencia en el texto principal
<figure>
<img src="imagenes/figure.png>
<figcaption>La fuerza de HTML5</figcaption>
</figure>
Elemento de una lista.
<ul>
<li>HTML5 </li>
<li>CSS3 </li>
<li>Javascript </li>
<ul>
Description for the preceding term.
<dl>
<dt>Chocolate</dt>
<dd>Elaborado a base de cacao</dd>
<dt>Caramelo</dt>
<dd>Elaborado a base de azucar</dd>
</dl>
Área de texto que forma parte de un formulario, suele ir con los atributos cols (columnas), rows (líneas) y name
<form>
<textarea name="data" cols="50" rows="5">
</textarea>
</form>
Este elemento muestra una barra de progreso.
Los atributos que podemos utilizar para esta etiqueta son:
El sexto tipo de encabezado, el más pequeño por defecto.
<h6>Este es el encabezado h6</h6>
Es una etiqueta semántica que agrupa un conjunto de elementos h1–h6, por ejemplo, cuando tenemos un titulo y a continuación una pequeña descripción o subtitulo.
<hgroup>
<h2>CocheFuturo</h2>
<h3>Bienvenido a tu web de coches</h3>
<h5>Debes de registrarte para ver las últimas novedades</h5>
</hgroup>
Especifica otros detalles, o los controles que se pueden ocultar o mostrar.El contenido de la etiqueta details no debe ser visible a menos que el atributo se encuentre “open”.
Hay que tener en consideración de que no funciona en todos los navegadores.
<details>
Esta parte solo se puede expandir y contraer si tu navegador es compatible
</details>
efine una sección de pie en una tabla. Cuando está presente, debe contener una o más filas que se supone, proveen información de pie para las celdas de datos.
<table border="1">
<thead>
<tr>
<th>Producto</th>
<th>Precio</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Total</td>
<td>$38</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Chocolate</td>
<td>$20</td>
</tr>
<tr>
<td>Dulces</td>
<td>$18</td>
</tr>
</tbody>
</table>
| Producto | Precio |
|---|---|
| Total | $38 |
| Chocolate | $20 |
| Dulces | $18 |
Una imagen, que tiene como atributos principales width y height, para la anchura y la altura respectivamente, junto con src, que indica donde está la imagen..
<img src="imagenes/figure.png>
Sirve para crear las distintas secciones en las que se puede dividir un mapas de imágenes en el cliente..
especifica un mapa de imagenes. Un mapa de imagenes es una imagen que permite clickear diferentes areas de la misma. Esta etiqueta requiere del atributo name, con el mismo nombre usado en el atributo usemap de la etiqueta img. De esta forma se establece la relación imagen-mapa.
representa un punto de integración para una aplicación externa o de contenido interactivo (en otras palabras, un plug-in)..
El elemento HTML object es usado para ejecutar aplicaciones externas como applets, películas flash o imágenes.
El elemento code source /code se usa para especificar los recursos de medios múltiples para los elementos code audio /code y code video /code en HTML 5. Se trata de un elemento vacío..
<video controls>
<source src="foo.ogg" type="video/ogg">
<source src="foo.mov" type="video/quicktime">
I'm sorry; your browser doesn't support HTML 5 video.
</video>
Permite usar un marco dentro de otro documento, para ello necesita un atributo src y el width y el height correspondientes
<iframe src ="http://netrunning.blogspot.com.es/" width="100%" height="200px">
</iframe>
Se puede utilizar para dibujar gráficos a través de secuencias de comandos (por lo general JavaScript ). Por ejemplo, puede usarse para dibujar gráficos, hacer composiciones de fotos o incluso realizar animaciones.
Esta etiqueta especifica las pistas de texto para los elementos multimedia
Se utiliza para especificar los subtítulos, el título archivos o archivos que contienen texto, que debe ser visible cuando los medios se está reproduciendo.
No todos los navegadores la soportan
Se usa para insertar contenido de audio en un documento HTML o XHTML.
<audio src="http://developer.mozilla.org/@api/deki/files/2926/=AudioTest_(1).ogg" controls>
</audio>
Sirve para introducr vídeos en nuestrás webs de forma sencilla.
<video src="videofile.ogg" poster="posterimage.jpg" controls>
</video>