Answer: By overlapping two lines of the same text phrase using negative margins.
The X-Files
The X-Files
If your browser doesn't support this CSS property, click here to see what it looks like.
The CSS rules used in the above example are as follows:
You can see how the shadow text is displayed first, followed by the text line, which, though it appears underneath the shadow line in the HTML code, actually appears slighly above it on the page, because we use a negative top margin of -64 pixels.
Note: This isn't the best way to overlap text (I'm saving that for Lesson 5). One reason is that each browser has slightly different margin defaults, so whereas this drop shadow looks perfect in Communicator for Mac and IE 4 and 5 for Windows, it doesn't even look like a drop shadow in other browsers. (If it doesn't in your browser, play with the margin values until it does.)
(By the way, considering my name, you knew I had to use an X-Files example eventually.)