CSS浮标定位

Question

我基本上是想在段落的右边放一个iframe。我理解在HTML中将iframe放在段落前面并使iframe浮动是可能的。如果将iframe放在段落后面，是否可以这样做？

HTML：

<div class="text">
<p>This is a sentence.</p>
</div>
<iframe src="https://www.youtube.com/embed/YbJOTdZBX1g"></iframe>

CSS：

iframe {
      float: right;
}

我认为这不是与：another question的重复，因为答案改变了html中iframe的顺序，并将其放在(段落)之前。

谢谢。

Answer 1

如果你也把段落朝相反的方向浮动，这是可能的。但是，您可能最终会遇到很多浮点数(例如“清除”)。

查看inline-block或flex布局，以获得更好的方法(甚至是网格布局，但浏览器支持可能仍然不稳定)。

避免使用表格来布局内容，它们也会带来许多意想不到的、难以调试的副作用。

​

.text {
  float: left;
}

iframe {
  float: right;
}

<div class="text">
<p>This is a sentence.</p>
</div>
<iframe src="https://www.youtube.com/embed/YbJOTdZBX1g"></iframe>

​