HTML and CSS Reference
How the browser works with images
Browsers handle <img> elements a little differently than other elements.
Take an element like an <h1> or a <p> . When the browser sees these
tags in a page, all it needs to do is display them. Pretty simple. But when
a browser sees an <img> element, something very different happens: the
browser has to retrieve the image before it can be displayed in a page.
The best way to understand this is to look at an example. Let's take a
quick look back at the elixirs page from the Head First Lounge, which
has four <img> elements:
<title> Head First Lounge Elixirs </title>
<h1> Our Elixirs </h1>
<h2> Green Tea Cooler </h2>
Chock full of vitamins and minerals, this elixir combines
the healthful benefits of green tea with a twist of chamomile
blossoms and ginger root.
<h2> Raspberry Ice Concentration </h2>
Combining raspberry juice with lemon grass, citrus peel and
rosehips, this icy drink will make your mind feel clear and
<h2> Blueberry Bliss Elixir </h2>
Blueberries and cherry essence mixed into a base of
elderflower herb tea will put you in a relaxed state of
bliss in no time.
<h2> Cranberry Antioxidant Blast </h2>
Wake up to the flavors of cranberry and hibiscus in
this vitamin C rich elixir.
<a href="../lounge.html"> Back to the Lounge </a>