CSS
HTML
COMPONENTS
CODE HUB
Generador de Rotura de Palabras CSS
Configuración
Espacio en Blanco
Clase
Vista previa
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Código
Aprende a programar con Lara
Domina los conceptos de programación paso a paso con tu tutora de IA interactiva. Lara explica lógicas complejas, revisa tus ejercicios prácticos y te ayuda a construir una base sólida en el desarrollo de software.
Lecciones de programación interactivas adaptadas a tu propio ritmo.
Empezar a aprender con LaraGenerador de Rotura de Palabras CSS
En CSS, la propiedad word-break se usa para controlar cómo se rompen y ajustan las palabras dentro de un elemento HTML cuando exceden el ancho del elemento. Esta propiedad es particularmente útil para manejar palabras largas o cadenas de caracteres en idiomas sin espacios, como el chino o el japonés.
La propiedad word-break puede tomar los siguientes valores:
normal (predeterminado): Las palabras pueden romperse en sus puntos de ruptura regulares.
.normal-word-break {
word-break: normal;
}
keep-all: Las palabras no se rompen, incluso si exceden el ancho del elemento. Esto es adecuado para idiomas donde los cortes de palabras deben mantenerse al mínimo.
.break-all-word-break {
word-break: break-all;
}
Aquí hay un ejemplo de cómo usar la propiedad word-break para permitir que las palabras se rompan en cualquier carácter:
.keep-all-word-break {
word-break: keep-all;
}
También puedes aplicar múltiples decoraciones de texto especificándolas como valores separados por espacios en la propiedad text-decoration. Por ejemplo, para subrayar y sobrealinear el texto simultáneamente:
.break-all-word-break {
word-break: break-all;
}
En este ejemplo:
- La clase .break-all-word-break usa la propiedad word-break para permitir que las palabras se rompan en cualquier carácter, lo cual puede ser útil para idiomas con delimitadores de palabras no espaciales o cuando se manejan URLs largas.
La propiedad word-break es esencial para manejar el diseño del texto y la ruptura de líneas en idiomas con reglas únicas de ruptura de palabras y puede ayudar a mejorar la legibilidad y el diseño del contenido textual en diversos escenarios.