Moriz Büsing
Moriz Büsing

Reputation: 367

Transparent text inside non-transparent div

I have a background image, and a white div on top of it. I want to have text inside that div that is transparent, so that you can see "through" to the background image. Is that at all possible?

Should look something like this:

Upvotes: 3

Views: 346

Answers (3)

Andrej Ilic
Andrej Ilic

Reputation: 81

Instead of text, just use a GIF image that has pixel "wholes" (text has no pixels, pixels surround it). That is probably a solution with highest compatibility.

Upvotes: 0

Brian
Brian

Reputation: 5028

You need to use this for your text in CSS

-webkit-text-fill-color: transparent;

Upvotes: 2

Babak Naffas
Babak Naffas

Reputation: 12561

Use the following CSS property on your white div to make the underlying image show through.

background: rgba(255, 255, 255, 0.6);

Upvotes: 1

Related Questions