Este video del canal de YouTube TLB STATION presenta y describe una serie de etiquetas HTML que no son muy conocidas y que pueden ser muy útiles.
Ellas son:
<abbr>
El elemento de abreviación representa una abreviación o acrónimo. Opcionalmente lleva el atributo title que debe contener solo la descripción completa de la abreviación.
Para ver este elemento en acción, coloque el puntero del ratón sobre la sigla HTML y verá una especie de tooltip con el valor del atributo title.
Vea más detalles del elemento HTML <abbr> en mdn.
<details> + <summary>
El elemento details genera un widget de revelación que permite al usuario acceder a información adicional, previamente oculta. A este tipo de widget habitualmente se le llama “acordeón”.
Dentro de la etiqueta details va:
- el título del widget dentro de una etiqueta
summary - el contenido que estará originalmente oculto.
Vea más detalles del elemento HTML <details> en mdn.
<fieldset> + <legend>
El elemento fieldset se utiliza en un formulario para agrupar elementos relacionados, creando una caja alrededor de ellos. Para darle un nombre o título a ese grupo de elementos se puede utilizar la etiqueta legend.
Vea más detalles del elemento HTML <fieldset> en mdn.
<datalist> + <option>
El elemento datalist especifica una lista de opciones predefinidas (como valores de los atributos value en etiquetas option) para un elemento input. También utiliza esos atributos de las etiquetas option para proveer de capacidades de autorrellenado.
Vea más detalles del elemento HTML <datalist> en mdn.
<dialog>
El elemento dialog se utiliza para crear una caja de diálogo (un popup o una ventana modal).
Vea más detalles del elemento HTML <dialog> en mdn.
<progress> + <meter>
El elemento progress se utiliza para mostrar el progreso de una tarea (como una barra de progreso) con los atributos value para indicar el estado de la tarea y max para indicar el valor máximo (la tarea completada).
El elemento meter es parecido al elemento progress pero agrega tres atributos (min, low, high) que marcan umbrales para el progreso, al estilo de un indicador de potencia de una batería.
Vea más detalles del elemento HTML <progress> y del elemento HTML <meter> en mdn.
<mark>
El elemento mark se utiliza para resaltar texto (de forma predefinida, le agrega un fondo amarillo). Si bien realizar esto con hojas de estilo es sencillo, hacerlo directamente en el código HTML tiene valor semántico.
Vea más detalles del elemento HTML <mark> en mdn.
<wbr>
El elemento wbr (word break opportunity) se utiliza para indicarle al navegador donde puede cortar una palabra si necesita crear una nueva línea. El caso de uso más habitual de este elemento son las urls muy largas, ya que este corte de palabra no incorpora un guión de separación de sílabas. Si lo que se desea es un guion suave, en lugar de este elemento se debe utilizar el caracter ­.
Vea más detalles del elemento HTML <wbr> en mdn.
Un par más de elementos sobre los que trata el video (<pre> y <code>) ya me eran conocidos.
No hay comentarios.:
Publicar un comentario
Lo que escriba a continuación será revisado antes de publicarse.
Gracias por tus comentarios.