En este artículo, aprenderemos cómo diseñar texto en Avenir Nex usando el kit de herramientas Tachyons. El kit de herramientas Tachyons es gratuito y de código abierto y se utiliza para crear un sitio web receptivo. Avenir Nex es un estilo de fuente que se utiliza para diseñar el texto.
Sintaxis:
<element-name class="avenir nex">...</element-name>
Clases usadas:
- Clase avenir nex: esta clase se utiliza para diseñar texto en Avenir Nex.
Ejemplo 1:
HTML
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href= "https://unpkg.com/tachyons@4.12.0/css/tachyons.min.css" /> </head> <body> <center> <h1 class="green"> GeeksforGeeks </h1> <h3 class="avenir nex"> A COMPUTER SCIENCE PORTAL FOR GEEKS </h3> </center> </body> </html>
Producción:
Ejemplo 2:
HTML
<!DOCTYPE html> <html> <head> <link rel="stylesheet" href= "https://unpkg.com/tachyons@4.12.0/css/tachyons.min.css" /> </head> <body> <center> <h1 class="green"> GeeksforGeeks </h1> <h3 class="avenir nex"> A COMPUTER SCIENCE PORTAL FOR GEEKS </h3> <button class="avenir nex"> GeeksforGeeks </button> <button class="avenir nex">About</button> <button class="avenir nex">Practice</button> <button class="avenir nex">DSA</button> </center> </body> </html>
Producción:
Referencia: https://tachyons.io/docs/typography/font-family/avenir/