图片与文字是做网站必不可少的要素，我们在使用图片与文字布局时，如何让图片和文字在同一行对齐显示来制作出一个整齐的网页出来。
对于一些学做网站新手来说，图片和文字在同一行对齐显示却不是一件容易的事情，这主要是由于他们对CSS 的知识并不是太了解。(了解更多CSS知识，可学习DIV+CSS教程.)
CSS控制图片和文字在同一行对齐显示
默认情况下，一个区域内有一段文字和图片，文字与图片的对齐方式为底部对齐。如下图:
如果要文字与图片的顶部对齐，需要设置图片的垂直对齐属性vertical。可以在IMG标签中加入这个属性，并且把它的值设为top;
我们看到当一段文字，我们使用图片的垂直属性来控制图文对齐时，只能控制一段文字的第一行与图片的顶部对齐，而下面的文字却并没有与图片对齐，所以对齐属性vertical只适用于一行文字的对齐。
图片与一段文字顶部对齐的CSS写法
做网站时，往往是在一段文字中插入一张图片，我们如何让网站中的一段文字与图片顶部对齐呢？我们可以使用float属性。代码如下：
通过设置图片为左浮动，就可以让图片位于整个区域名的左边，文字处于图片的右边与图片的顶部对齐。还可以通过设置margin属性来设置图片与文字之间的距离。
相关教程：怎样在图片上写文字
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@
特别注意：本站所有转载文章言论不代表本站观点！
本站所提供的图片等素材，版权归原作者所有，如需使用，请与原作者联系。
