Text Wrap Pretty llega a CSS — Amit Merchant — Un blog sobre PHP, JavaScript, etc.

Text Wrap Pretty llega a CSS — Amit Merchant — Un blog sobre PHP, JavaScript, etc.

Hablé de CSS text-wrap propiedad y su balance valor en uno de mis artículos anteriores donde el navegador intentaba ajustar el texto para que la última línea de un elemento fuera tan larga como la primera línea. Esto hace que el texto parezca equilibrado y más legible.

Índice
  1. EL pretty valor
  2. balance contra pretty
  3. Compatibilidad con navegador

EL pretty valor

Un nuevo valor que opera de manera similar llega al text-wrap propiedad llamada pretty que intentará dividir inteligentemente el texto en elementos de bloque para que no haya una sola palabra/huérfana en la última línea.

Entonces, por ejemplo, si hay un párrafo que consta de cuatro líneas y la última línea contiene solo una palabra, el pretty value intentará dividir el texto para que la última línea contenga dos o más palabras.

Considere el siguiente ejemplo.

Como puede ver, la última línea del párrafo contiene solo una palabra, lo cual no es lo ideal. Aquí es donde el pretty valor entre. Intentará dividir el texto para que no quede una sola palabra colgando en la última línea.

En otras palabras, los párrafos que terminarán con una sola palabra corta en la última línea se ajustan para que la última línea contenga dos o más palabras.

balance contra pretty

EL balance El valor se trata más de equilibrar el texto para que la última línea de un elemento sea tan larga como la primera línea. EL pretty El valor se comporta casi igual, pero se trata más de evitar la palabra única en la última línea cuando hay varias líneas en el elemento.

Compatibilidad con navegador

En cuanto al soporte del navegador, el text-wrap: pretty se estima que aterrizará en Chrom 114 en los navegadores de escritorio y Android según este borrador.

Si quieres conocer otros artículos parecidos a Text Wrap Pretty llega a CSS — Amit Merchant — Un blog sobre PHP, JavaScript, etc. puedes visitar la categoría Código.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Subir

Esta página web utiliza cookies para analizar de forma anónima y estadística el uso que haces de la web, mejorar los contenidos y tu experiencia de navegación. Para más información accede a la Política de Cookies . Ver mas