Lorsque vous ajoutez du texte au code HTML d'une page Web, par exemple dans un élément de paragraphe, vous n'avez pratiquement aucun contrôle sur l'endroit où ces lignes de texte seront rompues ou sur l'espacement utilisé. Cela est dû au fait que le navigateur Web passe le texte selon les besoins en fonction de la zone qui le contient. Cela inclut les sites Web réactifs qui auront une présentation très fluide qui changera en fonction de la taille de l'écran utilisé pour afficher la page. Le texte HTML brisera une ligne là où il le faudra une fois qu'il aura atteint la fin de sa zone de contenu. En fin de compte, le navigateur joue un rôle plus important que vous dans la détermination de la rupture du texte.
En ce qui concerne l'ajout d'espacement pour créer un format ou une présentation donnés, HTML ne reconnaît pas l'espacement ajouté au code, y compris les retours à la barre d'espacement, à tabulation ou à la ligne. Si vous placez vingt espaces entre un mot et le mot qui le suit, le navigateur ne restituera qu'un seul espace. C'est ce qu'on appelle l'effondrement des espaces et il s'agit en fait d'un des concepts du langage HTML avec lequel de nombreux nouveaux venus dans le secteur se débattent au début. Ils s'attendent à ce que les espaces blancs HTML fonctionnent comme dans un programme tel que Microsoft Word, mais ce n'est pas du tout le cas.
Dans la plupart des cas, le traitement normal du texte dans un document HTML correspond exactement à ce dont vous avez besoin, mais dans d'autres cas, vous souhaiterez peut-être davantage de contrôle sur la manière dont le texte est séparé et où il coupe les lignes. C'est ce que l'on appelle du texte pré-formaté (en d'autres termes, vous dictez le format). Vous pouvez ajouter du texte pré-formaté à vos pages Web à l'aide du code HTML.
En utilisant le Étiquette
Il y a de nombreuses années, il était courant de voir des pages Web avec des blocs de texte préformaté. En utilisant le
pré Une balise pour définir les sections de la page telles qu'elles étaient formatées par la dactylographie était un moyen simple et rapide pour les concepteurs Web d'obtenir le texte à afficher comme ils le souhaitaient. C'était avant l'avènement de CSS pour la mise en page, lorsque les concepteurs Web étaient vraiment bloqués pour essayer de forcer la mise en page en utilisant des tableaux et d'autres méthodes utilisant uniquement du HTML. Cela (un peu) a fonctionné parce que le texte pré-formaté est défini comme un texte dans lequel la structure est définie par des conventions typographiques plutôt que par le rendu HTML.
Aujourd'hui, cette balise est moins utilisée parce que CSS nous permet de dicter les styles visuels de manière beaucoup plus efficace que d'essayer de forcer l'apparence dans notre code HTML et parce que les normes Web dictent une séparation claire entre la structure (HTML) et les styles (CSS). Néanmoins, il peut arriver que du texte préformaté soit logique, comme pour une adresse postale où vous souhaitez forcer les sauts de ligne ou pour des exemples de poésie où les sauts de ligne sont essentiels à la lecture et au flux général du contenu.
Voici une façon d'utiliser le code HTML
étiquette:
Twas brillig et le slithey toves
A gyre et gimble
dans
la
wabe
Le code HTML typique réduit l'espace blanc dans le document. Cela signifie que les retours à la ligne, les espaces et les caractères de tabulation utilisés dans ce texte seraient tous réduits à un seul espace. Si vous avez saisi la citation ci-dessus dans une balise HTML typique telle que la balise p (paragraphe), vous obtiendrez une ligne de texte, comme ceci: Twas brillig et le slithey toves Did gyre et gimble dans le wabe La balise pre laisse les espaces blancs tels quels. Ainsi, les sauts de ligne, les espaces et les onglets sont tous conservés dans le rendu de ce contenu par le navigateur. Mettre la citation dans un pré balise pour ce même texte entraînerait cet affichage: Twas brillig et le slithey toves A gyre et gimble dans la wabe le pré tag fait plus que maintenir les espaces et les ruptures pour le texte que vous écrivez. Dans la plupart des navigateurs, il est écrit dans une police monospace. Cela rend les caractères du texte tous égaux en largeur. En d'autres termes, la lettre i prend autant de place que la lettre w. Si vous préférez utiliser une autre police à la place de la police monospace par défaut affichée par le navigateur, vous pouvez toujours la modifier avec des feuilles de style et sélectionner toute autre police dans laquelle vous souhaitez que le texte soit restitué. Une chose à garder à l'esprit est que, dans HTML5, l'attribut "width" n'est plus pris en charge pour la Édité par Jeremy Girard le 02/02/17 Concernant les polices
HTML5
élément. Dans HTML 4.01, la largeur spécifiait le nombre de caractères qu'une ligne pourrait contenir, mais cela a été supprimé pour HTML5 et les versions ultérieures.
