HTML and CSS Reference
In-Depth Information
where
folder1
,
folder2
,
folder3
, and so forth are subfolders, or
descendent folders
,
of the current folder. Going in the opposite direction, a relative path moving up the
folder tree to a
parent folder
is indicated by starting the path with a double period (..)
followed by a forward slash and the name of the fi le. Thus, the relative path
../fi le
references the
fi le
document located in the parent folder. Finally, to reference a different
folder on the same level as the current folder, known as a
sibling folder
, you move up
the folder tree using the double period (..) to the parent and then back down to a differ-
ent folder. The general syntax is
You can reference the cur-
rent folder using a single
period (.) character.
../folder/fi
/
fi le
where
folder
is the name of the sibling folder. Figure 2-16 shows the relative paths to
the six fi les in the tree from Figure 2-14, starting from the
camshots/pages/tips
subfolder.
Figure 2-16
Relative paths
Relative Path from the
/camshots/pages/tips Subfolder
Interpretation
tips1.htm
The tips1.htm file located in the current folder
tips2.htm
The tips2.htm file located in the current folder
../glossary/glossary.htm
The glossary.htm file located in the sibling glossary folder
../../index.htm
The index.htm file located in the parent camshots folder
You should almost always use relative paths in your links. If you have to move your
fi les to a different computer or server, you can move the entire folder structure without
having to edit the relative paths you've created. If you use absolute paths, you will proba-
bly have to revise each link to refl ect the new location of the folder tree on the computer.
Setting the Base Path
As you've just seen, a browser resolves relative paths based on the location of the current
document. You can change this behavior by using the
base
element to specify a different
starting location for all relative paths. The
base
element has the syntax
<base href=”
path
” />
where
path
is the folder location that you want the browser to use when resolving rela-
tive paths in the current document. The
base
element must be nested within the
head
element of the HTML fi le so it can be applied to all hypertext links found within the
document.
Using the
base
Element
• To set the default location for a relative path, add the element
<base href=”
path
” />
to the document head, where
path
is the folder location that you want browsers to
use when resolving relative paths in the current document.
