HTML and CSS Reference
Q: So matching tags don't have to be
on the same line?
A: No; remember the browser doesn't
really care about tabs, returns, and most
spaces. So, your tags can start and end
anywhere on the same line, or they can start
and end on different lines. Just make sure
you start with an opening tag, like <h2>, and
end with a closing tag, like </h2>.
Q: Why do the closing tags have that
A: That “/” in the closing tag is to help
both you and the browser know where a
particular piece of structured content ends.
Otherwise, the closing tags would look just
like the opening tags, right?
Q: I've noticed the HTML in some
pages doesn't always match opening tags
with closing tags.
A: Well, the tags are supposed to match.
In general, browsers do a pretty good job
of figuring out what you mean if you write
incorrect HTML. But, as you're going to see,
these days there are big benefits to writing
totally correct HTML. If you're worried you'll
never be able to write perfect HTML, don't
be; there are plenty of tools to verify your
code before you put it on a web server so
the whole world can see it. For now, just get
in the habit of always matching your opening
tags with closing tags.
Q: Well, what about that <img
src=“drinks.gif”> tag in the lounge
example? Did you forget the closing tag?
A: Wow, sharp eye. There are some
elements that use a shorthand notation with
only one tag. Keep that in the back of your
mind for now, and we'll come back to it in a
Q: An element is an opening tag +
content + closing tag, but can't you have
tags inside other tags? Like the <head>
and <body> are inside an <html> tag?
A: Yes, HTML tags are often “nested”
like that. If you think about it, it's natural
for an HTML page to have a body, which
contains a paragraph, and so on. So many
HTML elements have other HTML elements
between their tags. We'll take a good look
at this kind of thing in later chapters, but
for now just get your mind noticing how the
elements relate to each other in a page.
Tags can be a little more interesting than what you've seen so far. Here's the
paragraph tag with a little extra added to it. What do you think this does?
<p id="houseblend">A smooth, mild
blend of coffees from Mexico, Bolivia