Maison  >  Article  >  interface Web  >  Explication détaillée de l'habillage ou non du texte de la balise p et du masquage du texte en HTML

Explication détaillée de l'habillage ou non du texte de la balise p et du masquage du texte en HTML

黄舟
黄舟original
2017-07-03 13:32:317098parcourir

Lorsque nous mettons en page nos pages Web, nous utilisons la balise p. Habituellement, la balise p contient du texte chinois ou du texte d'autres pays. Si le texte est le texte, il y aura des sauts de ligne. et le forcer à ne pas s'enrouler. Et cacher le texte :
1. Retour à la ligne en anglais

Div p{ word-break:break-all; width:150px;}/*只对英文起作用,以字母作为换行依据*/
Div p{ word-wrap:break-word; width:150px;}/*--只对英文起作用,以单词作为换行依据*/

Notez que parfois les mots anglais forment un tout et ne peuvent pas être séparés ! ! !
2. Sauts de ligne chinois et aucun saut de ligne forcé

Div p{white-space:pre-wrap;width:150px;}/*只对中文起作用,强制换行*/
Div p{white-space:nowrap;width:10px;}/*强制不换行,都起作用*/

3. Aucun saut de ligne forcé et masquage du texte au-delà de la largeur

.p5{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100px;}//*不换行,超出部分隐藏且以省略号形式出现*/

.
Absolument. Veuillez noter qu'il doit y avoir une largeur dans la balise div ou p avant de pouvoir l'envelopper, sinon cela n'aura aucun effet ! ! !

Explication détaillée de lhabillage ou non du texte de la balise p et du masquage du texte en HTML

Paramètres :
normal : Conformément aux règles de texte des langues asiatiques et non asiatiques, les sauts de ligne dans les mots sont autorisés
break- all : LeComportement identique à la normale 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. Idéal pour les textes non asiatiques avec une petite quantité de texte asiatique

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!

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