So, Everyone likes cool and beautiful looking texts. There are many properties in text to style like shadow, stroke, color, etc!
Today, we are going to add an image in background of text.
Let's get started!
- Body of our code i.e. HTML:
<!DOCTYPE html>
<html>
<head>
<title>Text with Image as background</title>
</head>
<body>
<p>Good Morning</p>
</body>
</html>
- Style the text with CSS:
p {
background-image: url(image url);
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;
}
It's ready. It is very easy to make. I hope that you have successfully made it.
Thank you for reading!
Follow for more.
Top comments (0)