web-dev-qa-db-fra.com

CSS ou quoi? Forcer le texte à être divisé en plusieurs lignes

Forcer le texte à se diviser en plusieurs lignes lorsqu'il atteint la largeur maximale du '#div'.

Comment puis-je faire ceci? car, si j'essaie de sortir des données avec 200 caractères sans espacement, j'obtiens ce qui suit:

result1 (pas d'espacement):

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...

result2 (avoir un espace):

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa (space)
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...

Je veux le faire:

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa...

Dois-je utiliser les éléments suivants?:

 result+=str.substring(0,200)  "\n";

ou c'est un style CSS?

csshtmlstyling
18
John Bobs

Appliquer Word-break: break-all; fera en sorte que le texte passe à n'importe quel caractère chaque fois qu'il dépasse la largeur de son parent, sans avoir besoin d'espace ou d'un autre type de point d'arrêt.

42
K. V. Suresh

Comme déjà indiqué dans la réponse acceptée, utilisez ce qui suit:

Word-break:break-all;

La spécification W qui en parle semble suggérer que Word-break: break-all est pour exiger un comportement particulier avec le texte CJK (chinois, japonais et coréen), alors que Word-wrap: break- Word est le comportement le plus général, non compatible CJC. (crédit: AakashM : voir l'article )

Options de la propriété Word-Break ( W3Schools ):

normal      Default value. Break words according to their usual rules

break-all   Lines may break between any two letters

keep-all    Breaks are prohibited between pairs of letters

initial     Sets this property to its default value. Read about initial

inherit     Inherits this property from its parent element. Read about

Exemple de travail:

Word-Break W3Schools

5
Dan Beaulieu

faire un div plus petit et utiliser [~ # ~] css [~ # ~] text-align: justify et Word-break:break-all;

Est-ce ce que vous voulez?

5
Mohammad Masoudian

La propriété Word-break Peut être utilisée pour contrôler le flux de texte. La valeur suivante résoudrait votre problème: Word-break: break-all

Plus d'informations peuvent être trouvées ici: https://developer.mozilla.org/en-US/docs/Web/CSS/Word-break

0
Shreyash Shetty

utiliser div et définir la largeur d'un div dans un fichier CSS

    .respose container:{
width:200
}

Et puis dans le fichier html, ajoutez

<p div="response container">
if(string.length>limit)
{`return string.substring(0,limit)+'...';`
}
else
{`return string;`
}
</p>
0
Shreyash Shetty