Stroke Text CSS: la guía definitiva | Programar Plus

Siempre que pienso en texto con trazos en la web, pienso: no.

Hay -webkit-text-stroke en CSS para ello, pero coloca ese trazo en el medio del contorno vectorial de los caracteres, asegurando absolutamente que el carácter no se vea bien. Solo mira esto en Chrome o Safari. Bruto. Si va a hacerlo, al menos coloque el tipo correcto encima para que tenga su integridad original. E incluso entonces, bueno, no es estándar y no tiene soporte para varios navegadores.

John Negoita cubre el trazo de texto de muchas otras formas. Otra forma de fingir es usar text-shadow en múltiples direcciones.

Cuatro formas, como la figura de arriba, generalmente no lo cortan, por lo que se mata con eso. SVG es capaz de hacer trazos, lo que uno pensaría que sería mucho más inteligente, pero tiene exactamente el mismo problema que CSS con el trazo a horcajadas, solo que con algo más de control.

Probablemente evitaría el texto con trazos en la web en general, a menos que sea solo una vez, en cuyo caso lo convertiría en SVG en el software de diseño, simularía el trazo y lo usaría como un background-image.

Es posible verse bien.

Enlace directo →

(Visited 13 times, 1 visits today)