Saltar al contenido

¿Cómo usar guiones CSS automáticos con `word-break: break-all`?

Esta noticia ha sido probado por nuestros especialistas así se garantiza la exactitud de nuestra esta reseña.

los word-break la propiedad y la separación silábica son dos cosas completamente diferentes. El primero, originalmente destinado principalmente a los idiomas de Asia oriental, hace cosas malas en idiomas como el inglés: corta palabras arbitrariamente en algunos puntos sin indicar que se ha roto una palabra.

Por lo tanto, debe decidir si tiene una expresión en la que un navegador puede insertar un salto de línea en cualquier punto o si desea separación silábica.

Para la separación silábica, el código CSS como tal está bien, aunque muchas personas recomendarían poner la configuración de propiedad estándar hyphens: auto por último, después de las propiedades prefijadas. Pero requiere que el idioma del texto se declare en marcado HTML, usando por ejemplo

. Además, la compatibilidad con los navegadores sigue siendo limitada: IE 9 no admite este tipo de guiones, y la compatibilidad con IE 10 cubre un conjunto relativamente pequeño de idiomas (incluido el inglés, por supuesto).

Para la separación automática de palabras en IE 9, necesitaría usar la separación de palabras programada del lado del servidor o, más simple, la separación de palabras del lado del cliente con herramientas como Hyphenator.js.

los -ms-hyphens la propiedad solo funciona en IE10+. No es posible en IE9 o inferior.

Consulte la tabla de compatibilidad del navegador en la parte inferior del enlace de referencia que proporcionó.

Todavía no funciona en Chrome: WebKit Hyphenation

Los guiones se insertan si el navegador es compatible e incluye un diccionario de guiones. Pero tu

aaaaaaaaaaaaaaaaaa

no está en un diccionario.

Por lo tanto, debe insertar guiones suaves ­ a su satisfacción como en https://jsfiddle.net/LJYj3/5/

Aquí hay más elementos de reflexión: https://stackoverflow.com/a/856322/1696030

valoraciones y comentarios

Si para ti ha resultado de ayuda este artículo, sería de mucha ayuda si lo compartes con el resto juniors y nos ayudes a dar difusión a este contenido.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)


Tags :

Utiliza Nuestro Buscador

Deja una respuesta

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