HTML and CSS Reference
In-Depth Information
.
Output
FIGURE 9.5
Images can go
anywhere in text.
Text and Image Alignment
In these examples, the bottom of the image and the bottom of the text match up. The
<img>
tag also includes the
align
attribute, which enables you to align the top or bottom
of the image with the surrounding text or other images in the line.
NOTE
The
align
attribute for the
<img>
tag was deprecated in HTML
4.01 in favor of using CSS and has been dropped from HTML5
completely. However, you may find yourself using it if you're using
a content management system or some other application to pub-
lish Web content. In many cases it's easier to modify your markup
than it is to alter the style sheets for the site. Alternatively, you
can adjust the
style
attribute with your
img
tags.
Standard HTML 2.0 defines three basic values for
align
:
Aligns the top of the image with the topmost part of the
line (which may be the top of the text or the top of
another image). This is the same as
vertical-align:
top
in CSS.
align=“top”
Aligns the center of the image with the middle of the line
(usually the baseline of the line of text, not the actual
middle of the line). This is the same as
vertical-align:
middle
in CSS.
align=“middle”
Aligns the bottom of the image with the bottom of the line
of text. This is the same as
vertical-align: bottom
in
CSS.
align=“bottom”
There are also two other values:
left
and
right
. These values are discussed in the next
section, “Wrapping Text Next to Images.”
