左右对齐图像使用的技术是浮动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样式"/>-->
<b><i>HTML5</i></b> 由万维网联盟(W3C)2014年10月完成標準制定,取代1999年所制定的HTML 4.01和XHTML 1.0標準。HTML5 已广泛应用于各行各业。</p>
</body>
</html>