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
Learn to Code with Lara
Master programming concepts step-by-step with your interactive AI tutor. Lara explains complex logic, reviews your practice exercises, and helps you build a solid foundation in software development.
Interactive coding lessons tailored to your own pace.
Start learning with 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.