Inicio

HerramientasBlog

COMPONENTS


Generador de Ajuste de Desbordamiento CSS BETA

Configuración

Valor

Clase

Vista previa

This is a very, very, very long word. Pneumonoultramicroscopicsilicovolcanoconiosis

Código

Generador de Ajuste de Desbordamiento CSS

En CSS, la propiedad overflow-wrap se utiliza para controlar cómo se envuelven las palabras dentro de un elemento HTML cuando superan el ancho del elemento. Es particularmente útil para manejar palabras largas o cadenas de caracteres inrompibles dentro de los elementos, asegurando que el texto se envuelva de manera legible.

La propiedad overflow-wrap puede tomar uno de los siguientes valores: normal (predeterminado): Las palabras se rompen en sus puntos de ruptura regulares. Este es el comportamiento predeterminado.

break-word: Las palabras se romperán en cualquier carácter, incluso en el medio, si es necesario para evitar el desbordamiento. Esto puede llevar a rupturas irregulares de palabras, pero puede ser útil para manejar cadenas largas e inrompibles.

.normal-overflow-wrap { overflow-wrap: normal; }

Aquí tienes un ejemplo de cómo usar la propiedad overflow-wrap para romper palabras largas o cadenas de caracteres según sea necesario:

.break-word-overflow-wrap { overflow-wrap: break-word; }

En este ejemplo:

.break-word-overflow-wrap { overflow-wrap: break-word; }

La clase .break-word-overflow-wrap usa la propiedad overflow-wrap con el valor break-word, lo que permite romper las palabras en cualquier carácter para evitar el desbordamiento.

  • La propiedad overflow-wrap es especialmente útil para mejorar la legibilidad y el diseño del contenido textual en situaciones donde las palabras largas o cadenas necesitan ser envueltas para ajustarse al espacio disponible.

La propiedad overflow-wrap es especialmente útil para mejorar la legibilidad y el diseño del contenido textual en situaciones donde las palabras largas o cadenas necesitan ser envueltas para ajustarse al espacio disponible.


Herramientas destacadas

Hub de Código
Paleta de ColoresNUEVO
Generador de Contraseñas SegurasSelector de ColoresVerificador de Nombres de Usuario en Redes Sociales

Seleccionar idioma

Establecer tema

© 2024 ReadyTools. Todos los derechos reservados.