Hello guys, Welcome to my First Article. First, I will introduce myself. I am Tilak Jain, a Web Developer and a BCA Student.
So, today we are going to create a beautiful text that has image in it's background.
Let's get started!
1.Our HTML
<!DOCTYPE html>
<html>
<head>
<title>Text with Image as background</title>
</head>
<body>
<p>Good Morning</p>
</body>
</html>
We have a simple para tag. Now let us give it some css!
2.CSS
p {
background-image: url(image.jpg);
background-repeat: repeat;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-size: 8rem;
text-align: center;
font-weight: bold;
text-transform: uppercase;
font-family: Sans-Serif;
font-weight: 800;
}
So, this is it. In just few lines of css, we get a beautiful text. I hope that you have successfully made it.
You can also find my daily content on Instagram. Do check it out. Hope you find this useful. Thank you for reading!
See you soon...