下载掌阅APP，畅读海量书库
立即打开
设置图文的对齐方式可以使用img中的align属性，其对齐方式有以下几种。
● align=top：文本顶部对齐。
● align=middle：文本中央对齐。
● align=bottom：文本底部对齐。
● align=texttop：图像顶线对齐。
● align=baseline：图像基线对齐。
● align=left：图像左对齐。
● align=right：图像右对齐。
下面将分别举例说明图像与文本的各种对齐方式。
顶部对齐指的是将图像的顶部与文本的顶部对齐，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-4所示。
图3-4 网页效果
中央对齐指的是将图像的中央与文本的中央对齐，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-5所示。
图3-5 网页效果
底部对齐指的是将图像的底部与文本的底部对齐，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-6所示。
图3-6 网页效果
顶线对齐是以图像顶线为基准来对齐，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-7所示。
图3-7 网页效果
基线对齐是指以图像最下方的线条来对齐，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-8所示。
图3-8 网页效果
靠左对齐是指文字以图像顶端为标准对齐，并在图像的右侧显示，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-9所示。
图3-9 网页效果
靠右对齐是指文字以图像顶端为标准对齐，并在图像的左侧显示，示例代码如下。
将以上代码保存为HTML文件，使用浏览器打开，效果如图3-10所示。
图3-10 网页效果