pLas etiquetas se ajustan automáticamente de forma predeterminada, por lo que después de establecer un ancho, se puede lograr un buen efecto. Sin embargo, en proyectos recientes descubrí que después de cargar datos con ajax,pEl contenido dentro de la etiqueta no se ajustaba, lo que provocaba un diseño desordenado. Así que intenté usar estilos de salto de línea. Aunque resolvió el problema, no se encontró la causa raíz. La causa es que los datos que obtuve eran una larga secuencia de números; el navegador trata los números de manera similar a las palabras en inglés y no los corta.

Primero se presentan varios métodos, y luego se detalla cada propiedad.

Forzar no ajuste de línea:

p { white-space:nowrap; }

Ajuste automático de línea:

p { word-wrap:break-word; }

Forzar el salto de línea en palabras en inglés:

p { word-break:break-all; }

Nota:Para forzar el salto de línea en palabras en inglés, es necesario configurar el elemento en línea como elemento de bloque.

Mostrar elipsis al desbordarse:

p{text-overflow:ellipsis;overflow:hidden;}

white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit; 

• white-space: La propiedad establece cómo manejar los espacios en blanco dentro del elemento.
• normal: Predeterminado. Los espacios en blanco serán ignorados por el navegador.
• pre: Los espacios en blanco serán conservados por el navegador. Su comportamiento es similar a la etiqueta pre en HTML.
• nowrap: El texto no saltará de línea; continuará en la misma línea hasta que encuentre una etiqueta br.
• pre-wrap: Conserva las secuencias de espacios en blanco, pero realiza saltos de línea normalmente.
• pre-line: Combina las secuencias de espacios en blanco, pero conserva los saltos de línea.
• inherit: Especifica que el valor de la propiedad white-space se debe heredar del elemento padre.

word-wrap: normal|break-word; 

• word-wrap: La propiedad se utiliza para indicar si se permite al navegador dividir palabras dentro de una palabra, con el fin de evitar desbordamientos cuando una cadena es demasiado larga y no encuentra un punto de división natural.
• normal: Solo se salta de línea en los puntos de división de palabras permitidos (el navegador mantiene el procesamiento predeterminado).
• break-word: Saltos de línea dentro de palabras largas o direcciones URL.

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

• La propiedad word-break se utiliza para indicar cómo se realiza la división dentro de las palabras.
• normal: utiliza las reglas de salto de línea predeterminadas del navegador.
• break-all: permite saltos de línea dentro de las palabras.
• keep-all: solo puede saltar de línea en espacios de ancho medio o guiones.