Tachyons Typography Text Transform
Tachyons toolkit is a free and open-source CSS toolkit that is used to create a responsive website. In this article, we will learn how to transform text using the Tachyons toolkit.
Tachyons Typography Text Transform is used to change the capitalization of the text.
Syntax:
<element-name class="class-name">
...
</element-name>Tachyons Typography Text Transform Classes:
- ttu: This class is used to convert any text to uppercase.
- ttl: This class is used to convert any text to lowercase.
- ttc: This class is used to capitalize multiple words.
Example 1: In the below example, we will convert lowercase text to uppercase text.
HTML
<!DOCTYPE html><html> <head> <link rel="stylesheet" href=</head> <body> <center> <h1 class="green"> GeeksforGeeks </h1> <h3 class="ttu tracked"> A computer science portal for geeks </h3> </center></body> </html> |
Output:
Example2: In the below code we will change the text from uppercase to lowercase.
HTML
<!DOCTYPE html><html> <head> <link rel="stylesheet" href=</head> <body> <center> <h1 class="green"> GeeksforGeeks </h1> <h3 class="ttl tracked"> A COMPUTER SCIENCE PORTAL FOR GEEKS </h3> </center></body> </html> |
Output:
Reference: https://tachyons.io/docs/typography/text-transform/
Please Login to comment...