Una hoja de estilo en cascada es responsable de proporcionar los efectos y propiedades a los contenidos HTML. El contenido básico que se ve afectado es el texto a través de diferentes propiedades como el color de la fuente, el tamaño de la fuente, en forma de encabezado, párrafo o dentro de cualquier otro contenedor. En este artículo, discutiremos una propiedad CSS del texto que trata sobre el concepto de que el texto no debe envolverse, lo que significa que debe mostrarse tal como está escrito en el Editor de texto.

Propiedad de texto de envoltura CSS

Esta propiedad CSS es una propiedad relacionada con el texto. La propiedad de alineación del texto se usa aquí para ajustar el texto con la alineación dentro de cualquier contenedor externo o utilizando un área pequeña para mostrar de forma independiente. Permite que las palabras o oraciones largas se fijen en un área o contenedor en particular. También puede decir que las palabras largas se dividen en dos o más porciones para que puedan envolverse en la siguiente línea. Necesitamos aplicar tales etiquetas para minimizar las posibilidades de envolver el texto para que el texto se encuentre en una sola línea. Todos estos efectos se aplican de acuerdo con los requisitos.

Para lograr el texto de envoltura o no la propiedad de envoltura, utilizaremos una propiedad CSS especial que es la propiedad de White-Space.

Propiedad de espacio blanco

Esta es la propiedad CSS que ayuda a controlar cómo se utilizan la propiedad CSS de línea de línea y la propiedad de White-Space en cualquier creación y diseño de la página web. White-Space es el área que está presente entre el contenido HTML interno y el límite del contenido HTML externo. Esta propiedad determina cómo se maneja o controla el espacio blanco o el área dentro del elemento HTML.

A veces, el espacio se crea automáticamente. Necesitamos eliminarlo, o en otros casos, los efectos CSS especiales se aplican para administrar el espacio blanco dentro del elemento. Existe el mismo enfoque para aplicar o eliminar el texto de envoltura CSS correctamente.

La sintaxis básica de la propiedad WRAP es:

White-Space: Normal | Nowrap | Pre | Pre-Wrap | Pre-línea;

El valor puede ser cualquiera de los valores dados anteriormente que se dan a la propiedad de White-Space. Si el valor normal proporciona la propiedad del espacio blanco, esto significa que el espacio blanco alrededor del texto está de acuerdo con el gráfico estándar de normalidad. El pre-wrap causa el espacio blanco del lado izquierdo dentro del elemento. Este espacio está entre el texto y el elemento exterior, por lo que el lado izquierdo del elemento tendrá más espacio con el texto "pre" que tiene el espacio general antes del texto. La pre-línea provoca un espacio de línea entre el texto y el límite del elemento exterior.

Si no queremos envolver el texto, la propiedad de White-Space no es necesaria para aplicarse primero. Pero si el envoltorio de texto ya está hecho y necesitamos eliminarlo, usamos el valor "Nowrap" en esta propiedad.

Implementaremos este fenómeno en los siguientes ejemplos:

Ejemplo 1: No envuelva el texto con tablas HTML

En este ejemplo, manejaremos la propiedad del espacio blanco en el contenido de la tabla. Una tabla es un contenedor HTML que lleva el texto y otros contenidos dentro de él. La tabla difiere del contenedor Div ya que tiene filas y columnas. Una tabla tiene dos tipos de etiquetas más allá: la etiqueta de la cabeza y la etiqueta del cuerpo. La parte del cabezal contiene las filas de la tabla y la parte del cuerpo también contiene las filas de la tabla para agregar los datos de la tabla. Mientras que los datos HTML se ingresan en la tabla en forma de filas cada una dentro de la etiqueta de encabezado del cuerpo y el contiene solo las lecturas.

En el ejemplo, la tabla se aplica con la propiedad fronteriza que es 1 colapso.

primera fila

Este borde evita que las células de la tabla se envuelvan. El

y etiqueta. Esta sección contiene los valores con respecto al encabezado. Todas las filas adicionales se ingresan en la sección del cuerpo. Usamos el Etiqueta para los datos dentro de las filas de la tabla. Cierre todas las etiquetas y guárdelas.

Después del código corporal HTML, ahora usamos el cuerpo CSS para agregar los efectos del espacio blanco. No es necesario aplicar el CSS interno, ya que usaremos directamente el

se usan para agregar los elementos en la mesa. Cierre la etiqueta. Estas filas contienen el encabezado de la mesa. Ahora, usa el cuerpo
dentro de
etiqueta como el y etiquetas. Dentro de la etiqueta de estilo, el "th" se aplica por el efecto de espacio blanco. Mostramos el texto dentro como una oración completa en una sola línea, por lo que usamos la propiedad "Nowrap". Ahora, guarde el código en la extensión HTML. Ejecutar el archivo en el navegador para ver el valor resultante. Tras la ejecución, verá que se crea una tabla con el encabezado que se declara en la línea única, aunque es lo suficientemente largo como para aprovechar la propiedad del espacio blanco CSS. Ejemplo 2: No envuelva el texto con el párrafo Otro ejemplo que usamos aquí es el párrafo. Estos dos párrafos contienen una sola palabra de varias letras. Si se usa una oración en el párrafo, es fácil romper la oración en su lugar entre las palabras. Pero una sola palabra con numerosos caracteres sin espacio es difícil de sostener sin envolver el texto. El segundo párrafo se aplica con el ID de CSS. Esta identificación se declara en la sección principal, haciendo el CSS interno. Ambos párrafos tienen una sola palabra con numerosas letras. Ahora, considere el CSS de este código. Primero, todo el cuerpo se aplica con un efecto de relleno y un tamaño de fuente. El párrafo se aplica con valor de margen automático. Este valor es la distancia entre el contenido interno y el cuadro exterior. También agregamos la propiedad de relleno a ambos párrafos. La distancia entre el párrafo y el borde se calcula a través de este valor de relleno. La ID de desbordamiento contiene la propiedad de envoltura de texto y le da el valor para romper las palabras para que el texto pueda caber dentro del borde. #Desbordamiento Overflow-Wrap: Break-Word; Tras la ejecución, verá que el párrafo en el que no hemos aplicado ninguna clase para el espacio en blanco excedió el límite que iniciamos. Mientras que el segundo párrafo está limitado sobre dónde aplicamos el efecto de envoltura de desbordamiento para romper la palabra. Conclusión Este artículo es útil cuando necesitamos comprender el concepto de espacio blanco en el contenido HTML. Si queremos agregar este espacio blanco en el valor de contenido HTML, específicamente en el texto, el texto se dividirá en palabras separadas y utilizará dos o más oraciones. Pero si no queremos envolver el texto con la propiedad CSS White-Space, el texto se mostrará en una sola línea sin un descanso de palabras. Utilizamos dos ejemplos para elaborar la propiedad CSS "No envuelva texto" con la tabla y el párrafo. « CSS Plus Sign Función NetLink 7 C » php Cómo usar la función PHP GetDate GetDate () en PHP Devuelve una matriz que contiene todos los detalles de la hora actual, incluida un... Jacobo Piña php Cómo usar el descanso y continuar en PHP? En PHP, la instrucción Break se usa para terminar un bucle o una instrucción de interruptor mientras... Beatriz Enríquez php Cómo usar la función Array_Merge en PHP? La función array_merge () en PHP le permite combinar múltiples matrices en una. Siga este artículo p... Mariana Cotto Pitón Método estático de Python Call dentro de la clase Pilar Melgar Pitón Grupo pandas por cuantile Carolina Guzmán Pitón Python Oserror Pilar Alemán Pitón Convertir una cuerda a json python Homero Ontiveros php Cómo usar la función array_reverse en PHP Salvador Anaya C ++ Cómo usar Chrono en C++? Mariana Cotto AWS ¿Cuál es la diferencia entre AWS Batch y Lambda?? Mayte Mesa Oracle Linux ¿Cuál es la diferencia entre Oracle Virtualbox y VMware?? Beatriz Enríquez Java ¿Qué es la importación Java?.IO.*; en Java? Carolina Guzmán Potencia Shell Cómo usar el cmdlet de movimiento de movimiento en PowerShell? Mariana Cotto