Textured text with CSS?

I am currently developing a simple page.

Does anyone know of any way to overlay a texture image over text? This seems to be impossible with the current spec, but please let me know if this is possible.

Thanks and take care!

+5
source share
3 answers

You cannot overlay an image on top of text using native CSS 2.1, which also will not be implemented in CSS 3.0. It is best to use a background image and still use the text in the <h1> and hide it with CSS.

 <style> h1 { background:url(images/imagepath.png) no-repeat; height:50px; width:300px; text-indent:-10000px; } </style> <body> <h1>Insert Text Here</h1> </body> 
+3
source

Not only with pure CSS and, of course, not cross browser compatible. It is best to make this a transparent .png image.

+1
source

I don’t know why no one ever answered this. This is possible using background-clip : https://codepen.io/janeyee/pen/Leadx

+1
source

Source: https://habr.com/ru/post/896344/


All Articles