在代码插入图像的位置将对如何显示图像产生影响。以下分别是在代码插入图像的三种位置由此也会产生不同效果。
<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
<head>
<title>TODO supply a title</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<div>TODO write content</div>
<img src="images/bird.gif" alt="Bird" width="100" height="100" />
<p>第一种，在段落前，段落在图像之后另起一行开始显示</p>
<hr />
<p><img src="images/bird.gif" alt="Bird" width="100" height="100" />
第二种，在段落起始处，段落文本的第一行将于图像底部对齐</p>
<hr />
<p>第三种，在段落之中 <img src="images/bird.gif"
alt="Bird" width="100" height="100" />图像将位于它所在段落文字之中</p>
</body>
</html>
原文：https://www.cnblogs.com/q2546/p/9347324.html