html - 将图像向右浮动且无文字换行

标签 html css

https://jsfiddle.net/calebp/ksnmggL5/light/

我在尝试制作网页时遇到了一些困难。在链接的示例中,我将图像准确地放置在我想要的位置(较大的图像右对齐,横幅右对齐但在其左侧)。我遇到的问题是我想要横幅图片下方的段落。我怎样才能让它完全低于它,而不是一个随机的“the”漂浮在远处?

<div style="width: 920px;">
<div style="clear: both; text-align: left;">
<a href="largeimage.png"><img border="0" src="largeimage.png"  style="float: right; margin-bottom: 1em; margin-left: .75em;"/></a>
<img border="0" src="banner.png" style="clear: left; float: right; margin-bottom: 1em;"/>
<p>THE PARAGRAPH</p>
</div>
</div>

这是我想要的样子,但没有固定宽度: https://jsfiddle.net/calebp/ksnmggL5/5/

最佳答案

您可以将横幅和段落文本放在一个 div 中,并使宽度与横幅相同。

关于html - 将图像向右浮动且无文字换行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34460061/

相关文章:

android - 设置 html 基础页面 phonegap

html div解析问题

html - 响应式 3d 立方体 - 底部在 y 轴上移动并调整视口(viewport)大小

java - 添加下划线后如何阻止 JButton 的高度发生变化?

php - 以导航链接框为中心的箭头悬停效果

javascript - 鼠标悬停时短时间更改背景图像

html - 在一行内响应式地重新排序列

javascript - 单击链接时如何显示一个div

html - 图片流出div

html - 如何从导航栏和行中删除 "gap"?