- 浮动元素是相对于其父元素进行定位的。
- 浮动元素可以向左或向右浮动。
- 浮动元素与其他浮动元素和非浮动元素交互：
- 浮动元素不会覆盖非浮动元素。
- 浮动元素会与其他浮动元素重叠，叠加顺序取决于 CSS 的
z-index属性。 - 后面出现的浮动元素会覆盖前面出现的浮动元素，除非为其设置了较高的
z-index。
定位元素
- 定位元素相对于其最近的已定位祖先元素或浏览器视口进行定位。
- 定位元素可以有四种类型：
static（默认）：元素在正常文档流中relative：元素在正常文档流中，但根据其偏移量进行定位absolute：元素从正常文档流中移除，并根据其偏移量进行定位fixed：元素从正常文档流中移除，并相对于浏览器视口进行定位
- 定位元素与其他元素交互：
- 绝对定位元素在正常文档流之外，因此不会覆盖其他元素。
- 相对定位元素在正常文档流中，因此可以覆盖其他元素。
- 固定定位元素始终位于浏览器视口的最上方，不会覆盖其他元素。
框架标签
HTML 框架标签 (<iframe>) 用于在当前页面中嵌入另一个网页或文档。
框架标签与浮动元素和定位元素的交互
- 浮动元素可以包含在框架标签中。
- 定位元素可以包含在框架标签中。
- 框架标签本身可以浮动或定位。
- 浮动框架标签：
- 浮动框架标签相对于其父元素进行定位。
- 浮动框架标签中的内容不会覆盖其他元素。
- 浮动框架标签可以与其他浮动元素和非浮动元素重叠。
- 定位框架标签：
- 定位框架标签可以是任何类型的定位元素。
- 定位框架标签中的内容根据其定位类型进行定位。
- 绝对定位的框架标签不会覆盖其他元素。
- 相对定位的框架标签可以覆盖其他元素。
- 固定定位的框架标签始终位于浏览器视口的最上方，不会覆盖其他元素。
示例：
<div style="width: 50%; float: left;">
<iframe src="example.html" style="width: 100%; height: 500px;"></iframe>
</div>此示例创建一个浮动框架标签，该标签在页面中占 50% 的宽度，并包含 example.html 页面。该框架标签中的内容不会覆盖页面中的其他元素。
