Explication détaillée et exemples d'utilisation de l'attribut word-wrap en CSS3

Nous savons tous que l'attribut word-wrap est un nouvel attribut de CSS3, donc cet article expliquera en détail comment utiliser l'attribut word-wrap et le attribut. 🎜>Remarque, regardons un petit exemple ci-dessous.

1. Définition

L'attribut word-wrap permet de renvoyer des mots longs ou des adresses URL à la ligne suivante.

2. Syntaxe et paramètres

word-wrap : normal (par défaut) | break-word normal : autoriser le contenu à briser la limite spécifiée du conteneur si le mot l'est trop. long , sortira de la limite (affichée dans la ligne actuelle sans retour à la ligne). break-word : le contenu sera renvoyé à l'intérieur des limites. Lorsque le mot ne peut pas tenir sur la ligne actuelle, il passera automatiquement à la ligne suivante si nécessaire, word-break sera déclenché (remarque : veuillez). distinguer entre word-break et break-word sont deux choses différentes, l'une est un attribut et l'autre est un paramètre). Remarque : Tous les navigateurs peuvent le reconnaître.

3. Description

word-wrap contrôle s'il faut « couper les lignes pour les mots », et définit ou récupère s'il faut couper les lignes lorsque la ligne actuelle dépasse la limite du conteneur spécifié. Il n’y a aucun problème avec le chinois, ni avec les phrases en anglais. Mais pour de longues chaînes d’anglais, cela ne fonctionne pas.

4. Exemple

Le mot félicitation appartient à une longue chaîne de mots anglais. Word-wrap:break-word traite le mot entier dans son ensemble si la fin de la ligne ne l'est pas. suffisamment large pour afficher le mot entier, il le fera automatiquement. Mettre le mot entier sur la ligne suivante sans tronquer le mot est la raison pour laquelle cela ne fonctionne pas pour les longues chaînes de texte. word-wrap:normal est la valeur par défaut et les mots anglais ne sont pas divisés.

5. Résumé

La portée est uniquement les éléments standard au niveau du bloc tels que div Les éléments de table tels que th et td sont reconnus mais n'ont aucun effet (si td, th plus width word-. Wrap peut être efficace sous IE, mais du point de vue d'une compatibilité totale et d'une mémoire pratique, la conclusion précédente prévaudra).

Je pense que vous maîtrisez les méthodes après avoir lu ces cas. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture connexe :

Comment changer le style de survol de la souris sans utiliser CSS

Les causes et les solutions des pages Web HTML dislocation

Processus Js d'exploitation des objets DOM

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!