If you’ve written
web pages, then you’re familiar with URLs. URLs aren’t often used in
style sheets, but if you do need to refer to one—as in the
@import statement, which is used when importing an
external style sheet—then the general format is:
This example defines an absolute URL. By absolute, we mean a URL that will work no
matter what page it’s found in, because it defines an absolute
location in web space. Let’s say that we have a server called
www.waffles.org. On that server,
there is a directory called pix, and in this
directory is an image
waffle22.gif. In this
case, the absolute URL of that image would be http://www.waffles.org/pix/waffle22.gif.
This URL is valid no matter where it is found, whether the
page is on the server www.waffles.org or web.pancakes.com.
The other type of URL is a relative URL, so named because this type of URL specifies a location that is relative to the document that uses it. If you’re referring to a relative location, such as a file in the same directory as your web page, then the general format is:
This only works if the image is on the same server as the page that
contains the URL. For argument’s sake, we’ll assume that
we have a web page located at http://www.waffles.org/syrup.html and that we want the image
waffle.gif to appear on this page. In that case,
the relative URL could be pix/waffle22.gif.
This works because the web browser knows that it should take the same place it found the web document ...