Maison > Article > interface Web > Comment gérer le débordement CSS et les sauts de ligne
Comment gérer le débordement CSS et les sauts de ligne
- 零下一度original
- 2017-05-03 15:48:452846parcourir
1. Traitement des débordements
1, traitement des blancs
Lorsque le texte est trop long et ne peut pas être affiché dans le conteneur, que ce soit pour envelopper la ligne
Attributs : espace blanc : normal / nowrap
normal : Utiliser les paramètres par défaut du navigateur
nowrap : Pas de sauts de ligne
2, débordement de texte
Comment gérer le débordement,Si vous le souhaitez pour masquer le contenu de débordement, pensez à utiliser cet attribut.
Remarque : Cet attribut doit être utilisé en conjonction avec overflow:hidden
Attribut : text-overflow
Valeurs :
1, clip , couper, intercepter
2, points de suspension, utilisez ... (points de suspension) pour représenter le contenu non affiché
Par exemple :
<!DOCTYPE html > <head> <title>文本格式</title> <meta charset="utf-8" /> <style> p{ width:150px; height:50px; border:1px solid black; overflow:hidden; } #d1{ white-space:normal; text-overflow:ellipsis; } #d2{ white-space:nowrap; text-overflow:clip; } #d3{ white-space:nowrap; text-overflow:ellipsis; } </style> </head> <body> <p id="d1">longlonglonglonglonglonglonglonglonglong无法在框中容纳</p><br/> <p id="d2">longlonglonglonglonglonglonglonglonglong无法在框中容纳</p><br/> <p id="d3">longlonglonglonglonglonglonglonglonglong无法在框中容纳</p> </body> </html>
deux, saut de ligne
Remarque : valable uniquement pour l'anglais
1 , retour à la ligne long
W> Break-word :
La structure de la destruction des mots2
, changement de texteword-break:
value prend la valeur ： normal：
break-all:
casser le mot structurer et briser la lignegarder tout :
sous les espaces en demi-largeur Effectuer des sauts de ligneCe 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!