Maison > interface Web > tutoriel CSS > CSS contrôle l'habillage et le recadrage du texte

CSS contrôle l'habillage et le recadrage du texte

php中世界最好的语言
Libérer: 2018-03-22 16:53:26
original
2209 Les gens l'ont consulté

Cette fois, je vais vous présenter le retour à la ligne et le découpage du texte contrôlé par CSS. Quelles sont les précautions pour le retour à la ligne et le découpage du texte contrôlé par CSS. Voici des cas pratiques, jetons un coup d'œil.

Quelques propriétés CSS concernant le retour à la ligne et le recadrage

word-wrap : normal break-word

sauts de ligne normaux normalement, le contenu peut casser le conteneur, comme des mots longs ou des nombres longs
break-word utilise des mots comme base pour les sauts de ligne Si nécessaire, les sauts de ligne sont autorisés dans les mots

word -break : normal | break-all | keep-all

normal Saut de ligne normal, le contenu peut casser le conteneur, comme des mots longs ou des chiffres longs

break-all avec des lettres Comme base de saut de ligne

keep-all est le même que la normale en chinois et en anglais

espace blanc : normal || || nowrap || pre-line || pre- wrap || hériter

valeur par défaut normale, les espaces seront ignorés par le navigateur

les espaces pré seront conservés par le navigateur, et son le comportement est similaire à la balise

 en HTML 

nowrap Le texte ne sera pas renvoyé à la ligne, le texte sera sur la même ligne jusqu'à ce que la balise
soit rencontrée

pre-wrap Préserve la séquence d'espaces, mais s'enroule normalement (IE7-non pris en charge)

pre-line fusionne les séquences d'espaces, mais conserve les nouvelles lignes (IE7-non pris en charge)

inherit spécifie que la valeur de l'attribut d'espace blanc doit être hérité de l'élément parent (IE7 non pris en charge)

Application :

Le débordement de texte affiche les marqueurs de points de suspension (...) :

débordement de texte : points de suspension ;
débordement : caché
espace blanc :

Renvoi à la ligne :

/* Utiliser des mots comme base pour les sauts de ligne*/
retour à la ligne : saut-mot ;
saut de mot : normal ;
/* Utiliser des lettres comme base pour les sauts de ligne*/
word-break: break-all;

Le texte est forcé de ne pas être renvoyé à la ligne :

white-space: nowrap;

Je pense que vous l'avez maîtrisé après avoir lu le cas dans cet article Méthode, pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le php chinois site web!

Lecture recommandée :

Utilisation de CSS3 pour implémenter l'agrandissement flottant des images avec la souris

problème de compatibilité nth-child() sous IE8 Comment gérer la disparition de

dans la limite CSS Comment gérer

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal