HTML5, CSS3, and JavaScript Fourth Edition

(Ben Green) #1

CHAPTER 6. USING EXTERNAL RESOURCES 65


The relative way of talking about (2) would be this:


photo.jpg


With the relative way, we assume we are in the same folder on the same
website. This is called arelative URL.


Both ways work, but if we ever have to move that webpage to a new loca-
tion, absolute URLs need to be corrected. Relative URLs usually need no
correction because they are still right.


6.7 Sibling, Cousin, Second Cousin


If we want a file in the same folder as the webpage, the relative URL is
simple, as in the previous example. If (1) is our absolute address, and (2) is
the relative address, then (3) is the matching absolute address. This is like
being a sibling.


(1)http://example.com/abc/def/ghi/index.html


(2)photo.jpg


(3)http://example.com/abc/def/ghi/photo.jpg


We can also refer to the current directory by putting./in front of the file
name. Thus,photo.jpgmeans the same thing as./photo.jpgdoes. Dot
means where we are at right now. Dot dot means our parent directory.
Sometimes the dot slash is added for clarity or to avoid ambiguity, but
normally it is not written.


A file in the next higher (parent) directory has a relative address.


../photo.jpg


We can use..to go up a level from where we are now. If (1) is our absolute
address, and (2) is the relative address, then (3) is the matching absolute
address. This is like being an uncle or aunt.


(1)http://example.com/abc/def/ghi/index.html


(2)../photo.jpg


(3)http://example.com/abc/def/photo.jpg


We can use.. as many times as we want. ../..takes us up two levels
from where we are now. If (1) is our absolute address, and (2) is the relative
address, then (3) is the matching absolute address. This is like being a great

Free download pdf