Encapsuler automatiquement le contenu en HTML avant la production de pages tag_HTML/Xhtml_Web

À l'heure actuelle, vous pouvez utiliser overflow:auto; (lorsque le code dépasse les limites du conteneur, la zone de défilement s'affiche), mais cette méthode ne convient pas à tous les navigateurs grand public, et certains navigateurs tronqueront directement le contenu dépassé.

Nous savons tous que la balise

  peut définir du texte préformaté. Une application courante consiste à représenter le code source d'un ordinateur. Le texte inclus dans un élément pre conserve généralement les espaces et les nouvelles lignes, mais malheureusement, lorsque vous écrivez du code dans une balise 
, si vous ne l'encapsulez pas manuellement, il le conservera également pour vous au lieu de l'envelopper automatiquement. 

À l'heure actuelle, vous pouvez utiliser overflow:auto; (lorsque le code dépasse la limite du conteneur, la boîte de défilement s'affiche), mais cette méthode n'est pas applicable à tous les navigateurs grand public, et certains navigateurs tronqueront directement le contenu excédentaire. 
标签里的文本换行(兼容IE, FF和Opera等)" src="http://files.jb51.net/do/uploads/allimg/090606/0242050.png"  style="max-width:90%">
Comme il n'y a pas beaucoup d'endroits où le code source est utilisé sur ce site, je n'ai pas prêté beaucoup d'attention à ce problème auparavant, un internaute enthousiaste a signalé ce problème sur QQ, j'en ai donc profité. pour changer de thème et cherché une solution, partagez-la. 



Copier le code
Le code est le suivant :
 
pre { 
blanc -space : pré-enveloppement ; /* css-3 */ 
espace blanc : -moz-pre-wrap ; /* Mozilla, depuis 1999 */ 
espace blanc : -pre-wrap ; Opera 4- 6 */ 
espace blanc : -o-pre-wrap; /* Opera 7 */ 
word-wrap : break-word ; /* Internet Explorer 5.5 */ 
} 



Cette solution CSS peut faire en sorte que le texte de la balise pré soit automatiquement renvoyé. Je l'ai testé sur tous les navigateurs dont je dispose, et ils sont tous pris en charge, notamment IE6, IE7, IE8, Firefox, Opera, Safari et. Chrome. 
Ce n'est que lorsque vous réduisez la fenêtre à une largeur inférieure à 20 caractères qu'elle dépassera la limite 
 De plus, j'ai vu certains articles partageant également cette technique CSS, disant qu'elle pouvait résoudre le problème du retour à la ligne des fichiers longs mots, mais j'ai essayé. Au bout d'un moment, ça n'a toujours pas fonctionné.