Breve post para mostra un listado de las etiquetas HTML5 interactivas, estas nuevas etiquetas sirven para interactuar con el usuario y desencadenar acciones en la web.

Las nuevas etiquetas HTML5 interactivas

Os muestro el listado de estas etiquetas HTML5 extraído de su web oficial:

Etiqueta command HTML5

La etiqueta command HTML5 nos ayuda a definir botones que accionan comandos en nuestra página web. Siempre debe ir dentro de la etiqueta menu.

Su sintaxis es la siguiente:

<menu>
    <command type="" label=""></command>
</menu>

Para más información visitar el siguiente post:

Etiqueta menu HTML5

La etiqueta menu HTML5 tiene como finalidad especificar/determinar una serie de comandos a ser ejecutados por el usuario.

No confundir con la etiqueta nav cuyo fin es el de contener enlaces para navegar por la web (menú de navegación), mientras que menu HTML5 puede servir como barra de herramientas conteniendo acciones, funciones o comandos a ejecutar en la web.

Su sintaxis es la siguiente:

<menu type="" label="">
    <command type="" label=""></command>
    <button>...</button>
</menu>

Para más información visitar el siguiente post:

Etiqueta details HTML5

La etiqueta details HTML5 tiene como funcionalidad ofrecer y mostrar información complementaria y/o adicional de un elemento de la web.

Su comportamiento es como la de un widget que muestra y oculta información (Como un menú con efecto acordeón). Un ejemplo sería las especificaciones técnicas de un producto en el típico carrito de la compra.

Su sintaxis es la siguiente:

<details>
    <summary>Sumario explicativo</summary>
    <p>Datos y texto, Datos y texto, Datos y texto, Datos y texto</p>
</details>

Para más información visitar el siguiente post:

Etiqueta summary HTML5

La etiqueta summary HTML5 tiene como funcionalidad añadir un sumario en la etiqueta details que a su vez muestra información complementaria y/o adicional de un elemento de la web.

Su sintaxis es la siguiente:

<details>
    <summary>Sumario explicativo</summary>
    <p>Datos y texto, Datos y texto, Datos y texto, Datos y texto</p>
</details>

Para más información visitar el siguiente post:

compartir
Publicado por
Aner Barrena