假设我有类似以下代码的内容，我想在左右浮动的两个图像之间显示一些文本。
<img src="testImage1.png" alt="Test Image 1" style="float:right;" />
<img src="testImage2.png" alt="Test Image 2" style="float:left;" />
<p>Test Text</p>
我想在两个图像和文本周围添加边框。我尝试放一个<div>围绕上述所有 3 个标签并使用style="border:2px black solid;"。虽然这增加了边框，但似乎没有考虑到图像。也就是说，我们得到如下内容（使用 StackOverflow 和 Google 徽标）。
我猜测发生这种情况是因为浮动元素没有被视为浮动元素的一部分<div>。我是一名软件开发人员，而不是 Web 开发人员，所以我不是 CSS 专家。但我确实记得浮动元素在某种程度上被“忽略”了。谁能详细描述发生了什么以及如何解决它？
添加一个overflow在这种情况下，值为hidden or auto解决了这个问题。
检查下面的小提琴：
http://jsfiddle.net/XMrwR/ http://jsfiddle.net/XMrwR/
清除浮动溢流方式
http://www.quirksmode.org/blog/archives/2005/03/clearing_floats.html http://www.quirksmode.org/blog/archives/2005/03/clearing_floats.html
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
