Etiqueta HTML <wbr>
La etiqueta <wbr> se utiliza para indicar al navegador dónde en el texto podría añadirse un salto de línea. A diferencia de la <br> etiqueta, que obliga al navegador a insertar un salto de línea, cuando se usa <wbr> el navegador primero analiza su contenido y luego inserta un salto de línea si es necesario (palabra o dirección URL demasiado larga).
En caso de no usar la etiqueta <wbr>, las palabras largas podrían dividirse en un lugar incorrecto (haciéndolas difíciles de leer) o no dividirse en absoluto, lo que desplazaría el diseño de la página hacia un lado.
La etiqueta <wbr> es uno de los elementos de HTML5.
peligro
El elemento
<wbr>no introduce un guion en el punto de salto de línea. Si deseas que aparezca un guion solo al final de una línea, utiliza ­ (entidad de carácter de guion suave).
Es posible que no uses este elemento con frecuencia. Pero si lo necesitas, <wbr> será realmente útil. Veamos el siguiente ejemplo, donde tenemos una ruta de archivo.
Etiqueta HTML <wbr>
<p>You can find the file by going
C:\user\docs\Letter.txt
</p>Como puedes ver, no hay ninguna oportunidad de salto de línea y toda la ruta del archivo pasó a la siguiente línea. Si agregas elementos <wbr>, la ruta del archivo se dividirá correctamente al renderizar ese párrafo.
Etiqueta HTML <wbr>
<p>You can find the file by going C:<wbr>\user<wbr>\docs<wbr>\Files<wbr>\Letter.txt</p>Sintaxis
La etiqueta <wbr> es vacía, lo que significa que la etiqueta de cierre no es necesaria. Pero en XHTML, la (<wbr>) etiqueta debe cerrarse (<wbr/>).
Ejemplo de la etiqueta HTML <wbr>:
Etiqueta HTML <wbr>
<!DOCTYPE html>
<html>
<head>
<title>Title of the document</title>
</head>
<body>
<p>Example of a long string of text without wbr.</p>
<p>This is the longest word you can ever meet in the English language pneumonoultramicroscopicsilicovolcanoconiosis</p>
<p>Example of a long string of text with wbr.</p>
<p>This is the longest word you can ever meet in the English language pneumono<wbr />ultra<wbr />micro<wbr />scopic<wbr />silico<wbr />volcano<wbr />coniosis</p>
</body>
</html>Resultado
Atributos
La etiqueta <wbr> admite los atributos globales y los atributos de eventos.
Práctica
¿Cuál es el uso principal de la etiqueta <wbr> en HTML?