HTML + CSS to achieve gradient text

This looks pretty cool, so let’s do it.

1. html

<a href="#">hello,world</a>
Copy the code

2. css

   2.1 Creating a Background

   a {
       background-image: linear-gradient(120deg, blue, red);
   }
   Copy the code

   

   2.1 Render the background color onto the text

   a {
       background-image: linear-gradient(120deg, blue, red); // Set the font's original color to transparentcolor: transparent; // Render the background color only to the text -webkit-background-clip: text;
   }
   Copy the code

   

done !