Maison > Article > interface Web > Pré-balise en HTML

Pré-balise en HTML

WBOYoriginal: 2024-09-04 16:25:20763parcourir

Le navigateur Web ignore les espaces, les sauts de ligne et autres caractères de formatage du texte. Si vous souhaitez un format, alors la balise ou l'attribut doit être utilisé à chaque fois. Il est utilisé pour supprimer cet inconvénient. La balise Pre est utilisée pour conserver le format de texte tel quel. Il est modifié lorsque les balises CSS sont appliquées. Il affiche le texte préformaté du contenu.

Syntaxe :

HTML comporte de nombreuses balises à des fins différentes.

Exemple :

, etc.

Une balise pré a une balise d'ouverture ainsi qu'une balise de fermeture comme les autres balises HTML.

<pre class="brush:php;toolbar:false"> content of web

La syntaxe ci-dessus utilisée lorsque nous avons besoin du texte préformaté du contenu.

Comment fonctionne la pré-balise en HTML ?

Vous trouverez ci-dessous l'explication du fonctionnement du pré-tag :

1. Utiliser la balise pré en HTML

Code :

<!DOCTYPE>
<html>
<head>
<title> using pre tag in html </title>
</head>
<body>
<pre class="brush:php;toolbar:false">
The Web browser is ignored space,   line breaks, and other formatting characters of text.
If you wanted some   format then tag or attribute must have used every time.
Pre tag in HTML used to remove this drawback. Pre tag used to keep text format as it is.
It is   changed when CSS tags are applied.
Pre tag in HTML shows the  preformatted text of the content.

Sortie :

Pré-balise en HTML

Explication du code ci-dessus : Montrez l'exemple ci-dessus. Lorsque la pré-balise est appliquée dans la partie requise du contenu, le contenu apparaît formaté tel quel. L'espace et la ligne suivante ne sont pas ignorés lorsque la balise pre est appliquée au texte.

2. Sans utiliser de pré-balise en HTML

Code :

<!DOCTYPE>
<html>
<head>
<title> using pre tag in html </title>
</head>
<body>
The Web browser is ignored space, line breaks, and other
formatting characters of text.
If you wanted some format then tag or attribute must have
used every time.
This tag is used to remove this drawback. Pre tag used to
keep text format as it is. It is changed when CSS tags are applied.
This pre tag shows the preformatted text of the content.
</body>
</html>

Sortie :

Pré-balise en HTML

Explication du code ci-dessus : Affichez l'exemple ci-dessus, qui est sans l'utiliser. Espace, saut de ligne et nouvelle ligne automatiquement ignorés. La page Web affiche le contenu en fonction de leurs besoins. Pour donner de l'espace et casser la ligne, nous devons utiliser des balises HTML.

3. Utiliser d'autres balises HTML

Code :

<!DOCTYPE>
<html>
<head>
<title> using pre tag in html </title>
</head>
<body>
The Web browser is ignored space,         line breaks, and other formatting characters of text.<br>
If you wanted some      format then tag or attribute must have used every time.<br>
This is used to remove its drawback. Pre tag used to keep text format as it is.<br> It is changed when CSS tags are applied. <br>
It shows preformatted text of the content.<br>
</body>
</html>

Sortie :

Pré-balise en HTML

Explication du code ci-dessus : Affichez l'exemple ci-dessus, qui n'utilise pas la balise pre. Mais au lieu d'utiliser la balise pre, nous utilisons d'autres balises HTML.
tag est utilisé pour couper la ligne et caractère utilisé pour l'espace.

Utilisation du pré-tag

Les pages Web ignorent les espaces et les sauts de ligne si nous n'utilisons pas de balises et d'attributs. Mais à chaque ligne, nous devons utiliser ces attributs.
La balise Pre préserve le format du contenu original.
Le développeur peut utiliser une seule balise pour le bloc au lieu d'utiliser plusieurs balises. Réduisez le codage et facile à comprendre.

Pre Tag prend en charge les navigateurs Web suivants :

Google Chrome
Internet Explorer
Firefox
Opéra
Safari

Exemple à mettre en œuvre

Vous trouverez ci-dessous des exemples de mise en œuvre :

Exemple n°1

Utiliser Pre Tag avec une balise CSS.

Code :

<!DOCTYPE>
<html>
<head>
<title> using pre tag with CSS </title>
<style>
pre {
font-family: Arial;
color: yellow;
border: solid black;
background-color: black;
}
</style>
</head>
<body>
<pre class="brush:php;toolbar:false">
The Web browser is ignored space, line breaks, and other formatting characters of text.
If you wanted some format then tag or attribute must have used every time.
This tag in HTML used to remove this drawback. Pre tag used to keep text format as it is.
It is changed when CSS tags are applied.
This tag in HTML shows the preformatted text of the content.

Sortie :

Pré-balise en HTML

Explication du code ci-dessus : Montrez que l'exemple ci-dessus l'utilise avec des balises de style CSS. Si vous avez utilisé la balise pré, les balises de style CSS peuvent également modifier le format du contenu. La balise de style utilisait le style de police, la bordure et la couleur du texte en CSS.

Exemple n°2

L'exemple ci-dessous. Il s'agit d'une combinaison d'autres balises HTML et balises pré avec CSS.

Code :

<!DOCTYPE>
<html>
<head>
<title> using pre tag in html  with CSS </title>
<style>
pre {
font-family: Arial;
color: yellow;
border: solid black;
background-color:black;
}
</style>
</head>
<body>
<p>
The Web browser is ignored space, line breaks, and other formatting characters of text.
If you wanted some format then tag or attribute must have used every time.
This tag used to remove this drawback. Pre tag used to keep text format as it is.
It is changed when CSS tags are applied.
It shows the preformatted text of the content.
</p>
<pre class="brush:php;toolbar:false">
The Web browser is ignored space, line breaks, and other formatting characters of text.
If you wanted some format then tag or attribute must have used every time.
This tag in HTML used to remove this drawback. Pre tag used to keep text format as it is.
It is changed when CSS tags are applied.
This tag in HTML shows the preformatted text of the content.

Sortie :

Pré-balise en HTML

Conclusion

Le développeur utilise cette balise pour réduire le codage et obtenir du contenu formaté. Le Web ne peut pas ignorer le format du contenu à l’intérieur de la balise pre.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

firefox css chrome safari html if for format break using Attribute this border

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Balises en ligne en HTMLArticle suivant：Balises en ligne en HTML

Articles Liés

Voir plus