<wbr> : l'élément d'opportunité de saut de ligne
Baseline
Widely available
Cette fonctionnalité est bien établie et fonctionne sur de nombreux appareils et versions de navigateurs. Elle est disponible sur tous les navigateurs depuis juillet 2015.
L'élément HTML <wbr> permet de représenter un emplacement où casser la ligne si nécessaire. Le navigateur pourra alors utiliser cet emplacement pour effectuer un saut de ligne si le texte est trop long et qu'en temps normal, une règle empêche le saut de ligne.
Exemple interactif
<div id="example-paragraphs">
<p>Fernstraßenbauprivatfinanzierungsgesetz</p>
<p>Fernstraßen<wbr />bau<wbr />privat<wbr />finanzierungs<wbr />gesetz</p>
<p>Fernstraßen­bau­privat­finanzierungs­gesetz</p>
</div>
#example-paragraphs {
background-color: white;
overflow: hidden;
resize: horizontal;
width: 9rem;
border: 2px dashed #999999;
}
Attributs
Cet élément inclut uniquement les attributs universels.
Notes
Sur les pages encodées en UTF-8, <wbr> se comporte comme le point de code U+200B ZERO-WIDTH SPACE. En particulier, il agit comme un point de code Unicode bidi BN, ce qui signifie qu'il n'a aucun effet sur l'ordre bidi : <div dir=rtl>123,<wbr>456</div> affiche, si la ligne n'est pas coupée, 123,456 et non 456,123.
Pour la même raison, l'élément <wbr> n'introduit pas de trait d'union au point de coupure de ligne. Pour faire apparaître un trait d'union uniquement en fin de ligne, utilisez plutôt l'entité de caractère tiret conditionnel (­).
Exemples
HTML
<p>
http://voici<wbr />.une<wbr />.très<wbr />.très<wbr />.longue<wbr />.URL<wbr />.com/avec<wbr />/pleins<wbr />/de<wbr />/niveaux<wbr />/de<wbr />/pages
</p>
Résultat
Résumé technique
| Catégories de contenu | Contenu de flux, contenu phrasé. |
|---|---|
| Contenu autorisé | Vide |
| Omission de balise | Cet élément est un élément vide, il doit avoir une balise de début et ne doit pas avoir de balise de fin. |
| Parents autorisés | Tout élément qui accepte du contenu phrasé. |
| Rôle ARIA implicite | Pas de rôle correspondant (angl.) |
| Rôles ARIA autorisés | Tous les rôles sont autorisés. |
| Interface DOM | HTMLElement |
Spécifications
| Specification |
|---|
| HTML # the-wbr-element |
Compatibilité des navigateurs
Voir aussi
- La propriété CSS
overflow-wrap - La propriété CSS
word-break - La propriété CSS
hyphens - L'élément
<br>