Maison  >  Article  >  interface Web  >  Comment implémenter CSS sans retour à la ligne, retour à la ligne automatique et retour à la ligne forcé_Échange d'expérience

Comment implémenter CSS sans retour à la ligne, retour à la ligne automatique et retour à la ligne forcé_Échange d'expérience

WBOY
WBOYoriginal
2016-05-16 12:05:121696parcourir

Ne forcer aucun saut de ligne

div{
white-space:nowrap;
}

Envelopper automatiquement

div{
word-wrap: break- word ;
word-break: normal;
}

Forcer le saut de ligne de mot anglais

div{
word-break:break-all
}



Les paramètres CSS ne s'enroulent pas :


overflow:hidden Hide
espace blanc : normal Par défaut
pré Les sauts de ligne et autres caractères d'espacement seront être protégé
nowrap force tout le texte à être affiché sur la même ligne jusqu'à la fin du texte ou jusqu'à la rencontre de l'objet br


paramètres pour forcer les sauts de ligne :
saut de mot :
normal ; selon les langues asiatiques et non asiatiques Règles de texte qui autorisent les sauts de ligne dans les mots
break-all : Ce comportement est le même que celui normal pour les langues asiatiques. Les sauts dans n'importe quel mot d'une ligne de texte en langue non asiatique sont également autorisés. Cette valeur convient au texte asiatique contenant du texte non asiatique
keep-all : Identique à la normale pour toutes les langues non asiatiques. Pour le chinois, le coréen et le japonais, les sauts de mots ne sont pas autorisés. Convient aux solutions de hauteur entre le texte non asiatique contenant une petite quantité de texte asiatique et



L'anglais ne s'enroule pas

Ajouter un saut de mot : break-all en CSS ; Résolution de problèmes. Ce problème n'existe que dans IE. Lorsqu'il est testé sous FF, FF peut ajouter des barres de défilement par lui-même, ce qui n'affectera pas l'effet

Il est recommandé que lors de l'exécution de Skin, n'oubliez pas d'ajouter word-break: break-all. ; dans le corps. Cela fonctionnera Résoudre le problème de l'ouverture du cadre d'IE par l'anglais

Ce qui suit cite les instructions de word-break, veuillez noter que word-break est un attribut propriétaire d'IE5+

Syntaxe :

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

Paramètres :

normal : Conformément aux règles de texte asiatiques et non- Langues asiatiques, les sauts de ligne dans les mots sont autorisés
break-all : Le comportement est le même que celui normal pour les langues asiatiques. Les sauts dans n'importe quel mot d'une ligne de texte en langue non asiatique sont également autorisés. Cette valeur convient au texte asiatique contenant du texte non asiatique
keep-all : Identique à la normale pour toutes les langues non asiatiques. Pour le chinois, le coréen et le japonais, les sauts de mots ne sont pas autorisés. Convient au texte non asiatique contenant une petite quantité de texte asiatique

Description :

Définit ou récupère le comportement de retour à la ligne intra-mot pour le texte dans un objet. Surtout lorsque plusieurs langues apparaissent.
Pour les chinois, break-all doit être utilisé.
La fonctionnalité de script correspondante est wordBreak. Veuillez consulter les autres livres que j'ai écrits.

Exemple :

div {word-break : break-all }

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