左右对齐图像使用的技术是浮动div元素。
float:left 左对齐
float:right右对齐
示例
<!DOCTYPE html>
<
html
>
<
head
>
<
title
>图像左右对齐</
title
>
<
meta
charset
=
"UTF-8"
>
<
style
type
=
"text/css"
>
body {
font-family: Georgia, "Times New Roman", serif; /* 字体样式 */
color: #665544;} /* 字体颜色 */
img.align-left { /* 图片左边对齐 */
float: left; /* 悬浮 左边 显示 */
margin-right: 10px;} /* 右边外边距 10 像素 */
img.align-right { /* 图片右边对齐 */
float: right; /* 悬浮 右边 显示 */
margin-left: 10px;} /* 左边外边距 10 像素 */
img.medium { /* 图像中间 */
width: 250px; /* 宽度250 像素 */
height: 250px;} /* 高度250像素 */
</
style
>
</
head
>
<
body
>
<
h1
>软件开发，成就梦想</
h1
>
<
p
><
img
src
=
"https://www.0735it.net/images/kc/jspservlet.jpg"
alt
=
"Servlet/JSP课程"
class
=
"align-left medium"
/><
b
><
i
>Servlet</
i
>
</
b
> 用Java编写的服务器端程序，可以交互式地浏览和修改数据，生成动态Web内容。是Java企业级应用技术第一站。</
p
> <!--网页插入图片格式:<img src="地址.png" alt="所要显示的文字" class="CSS样式"/>-->
<
p
><
img
src
=
"https://www.0735it.net/images/kc/h5.jpg"
alt
=
"HTML5 课程"
class
=
"align-right medium"
/>
<
b
><
i
>HTML5</
i
></
b
> 由万维网联盟（W3C）2014年10月完成標準制定，取代1999年所制定的HTML 4.01和XHTML 1.0標準。HTML5 已广泛应用于各行各业。</
p
>
</
body
>
</
html
>