HTML and CSS Reference
In-Depth Information
Finding the path from “elixir.html” to “red.jpg”
The elixirs page contains images of several drinks: “red.jpg”,
“green.jpg”, “blue.jpg”, and so on. Let's figure out the path to
“red.jpg” and then the rest will have a similar path because they
are all in the same folder:
GOAL
: we're
in the
bevera
ges fold
er and
we
need t
o get o
ver to
the
images
folder
.
<html>
lounge
.
.
</html>
lounge.html
green.jpg
…and
find
a
pat
h to h
ere.
<html>
beverage
s
<html>
images
about
.
.
.
.
blue.jpg
</html>
</html>
drinks.gif
directions.html
elixir.html
lightblue.jpg
red.jpg
(1) So
we go u
p to th
e parent
folder
, “lounge
”. Reme
mber
this w
ill be wr
itten a
s “..” in
the pa
th.
(3)
Finall
y, we f
ind “re
d.jpg”
.
So putting (1) , (2), and (3) together, we get:
Down into
the “images”
folder
U
p to t
he
parent f
older
.. / images / red.jpg
<img src="../images/red.jpg">