Maison > interface Web > Questions et réponses frontales > Comment forcer aucun saut de ligne en CSS3

Comment forcer aucun saut de ligne en CSS3

藏色散人
Libérer: 2021-06-01 10:25:24
original
1768 Les gens l'ont consulté

Comment forcer l'absence de saut de ligne en CSS3 : créez d'abord un exemple de fichier HTML ; puis créez une balise p ; enfin, définissez le style "white-space:nowrap;" pour forcer l'absence de saut de ligne.

Comment forcer aucun saut de ligne en CSS3

L'environnement d'exploitation de cet article : système Windows 7, version CSS3, ordinateur Dell G3.

css implémente le retour à la ligne forcé/le retour à la ligne automatique/le retour à la ligne forcé

Dans notre codage quotidien, nous rencontrons souvent l'exigence que ce texte ne puisse pas être renvoyé à la ligne, ou que le le texte ne peut pas être renvoyé automatiquement à la ligne. Bien que cette fonction soit très courante dans notre vie quotidienne, je crois que tout le monde ne pourra pas s'en souvenir (au moins Xiaoyue est très paresseux et ne vérifie jamais ce qu'il utilise hehe...). Aujourd'hui, nous allons apprendre à maîtriser la méthode d'utilisation du css pour forcer le texte à ne pas s'enrouler/automatiquement l'enrouler/forcer l'habillage du texte. Les amis qui en ont besoin peuvent venir apprendre ensemble !

  • Forcer l'absence de retour à la ligne

p{
    white-space:nowrap;
}
Copier après la connexion
  • Retour automatique de la ligne

p{
    word-wrap: break-word;
    word-break: normal;
}
Copier après la connexion
  • Forcer le saut de ligne des mots anglais

 p{
    word-break:break-all;
 }
Copier après la connexion
  • Le paramètre CSS ne coupe pas les lignes :

  • overflow:hidden Hide
  • white-space: normal Default
  • les pré-nouvelles lignes et autres caractères d'espacement seront protégés
  • nowrap force tout le texte à être affiché sur la même ligne jusqu'à ce que le la fin du texte ou un objet br est rencontré
  • Définir un saut de ligne forcé :

  • saut de mot :
  • les sauts de ligne normaux ; autorisé selon les règles textuelles des langues asiatiques et non asiatiques
  • break-all : ce comportement est le même que celui normal dans 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 pour une résolution en hauteur entre du texte non asiatique contenant une petite quantité de texte asiatique et l'

anglais sans sauts de ligne

CSS里加上 word-break: break-all; 问题解决。这个问题只有IE才有,在FF下测试,FF可以自己加滚动条,这样也不影响效果

建议大家做Skin时,记得在body里加 word-break: break-all; 这样可以解决IE的框架被英文撑开的问题

以下引用word-break的说明, 注意word-break 是IE5+专有属性
Copier après la connexion

Syntaxe : mot-break: normal | tout casser | paramètre: normal : autoriser les sauts de ligne dans les mots conformément aux règles de texte pour les langues asiatiques et non asiatiques break-all : ce comportement est le même que celui normal dans 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 : Idem que d'habitude pour toutes les langues non asiatiques. Pour le chinois, le coréen et le japonais, les sauts de mots ne sont pas autorisés. Idéal pour les textes non asiatiques avec une petite quantité de texte asiatique illustrer: Définit ou récupère le comportement de retour à la ligne pour le texte dans un objet. Surtout lorsque plusieurs langues apparaissent. Pour le chinois, il faut utiliser break-all.

Étude recommandée : "Tutoriel vidéo CSS"

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