From the course: CSS: Advanced Typographic Techniques

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Simulating submerged text

Simulating submerged text - jQuery Tutorial

From the course: CSS: Advanced Typographic Techniques

Start my 1-month free trial

Simulating submerged text

In this exercise, we want to simulate, sort of, the blurry look of text being submerged under water. So, to do that, we're going to have to blur our bottom text and, and the secret, or the trick, if you will, to creating blurred text Is to remove or either seriously diminish the foreground color of the text. And then use a really diffused text shadow to create the actual blur itself. So, I'll be working with the submerged.htm file in the 04_05 directory. And if I scroll down, I can see that I've added something to this one. and what I have added is some default paragraph styling. If I check that out in the browser, you can see, if I scroll down, now I have a duplicate of the word submerge. Same size. Pretty much the same color everything and all that. Maybe a little, it's actually using white instead of that sort of off blue, bluish white that I'm using for submerge on the top version of it anyway. So it's almost an exact duplicate underneath it. Okay. So I need to add a couple of…

Contents