我的图像需要下面的描述(名称和标题),然后是一个包含在图像周围的几段的传记。我尝试将文本浮动到左侧并使用img标记中的align =“left”,但是如果段落文本环绕图像,我怎样才能确保名称和描述固定在下面?这是一个示例:
<div class="info">
<img src="../img/test.jpg" alt="test pic">
<br>
John Doe
<br>
President
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam convallis pellentesque orci a pulvinar. Donec rutrum ipsum eget justo venenatis ultricies vel ac mi. Praesent pellentesque libero at porta ultrices. Nullam venenatis velit ut molestie aliquet. Nullam ac justo vestibulum, rhoncus nibh id, tempus ante. Nulla vel enim eu massa congue mattis ut nec erat. In vel rutrum quam, non pellentesque nisi. Vivamus rutrum purus et pellentesque ultricies. Aenean feugiat diam nec lacus placerat, ac elementum nulla iaculis. Nunc accumsan adipiscing arcu sit amet ultrices.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam convallis pellentesque orci a pulvinar. Donec rutrum ipsum eget justo venenatis ultricies vel ac mi. Praesent pellentesque libero at porta ultrices. Nullam venenatis velit ut molestie aliquet. Nullam ac justo vestibulum, rhoncus nibh id, tempus ante. Nulla vel enim eu massa congue mattis ut nec erat. In vel rutrum quam, non pellentesque nisi. Vivamus rutrum purus et pellentesque ultricies. Aenean feugiat diam nec lacus placerat, ac elementum nulla iaculis. Nunc accumsan adipiscing arcu sit amet ultrices.</p>
答案 0 :(得分:1)
好的,从评论延伸:
不是浮动图像,而是实际浮动整个div:
div.info {
float:left;
text-align:center; /* so the text is centered */
}