今天要來跟大家分享的是 CSS 中如何使嵌入式框架（iframe）居中。 先來看一下一個示例代碼，HTML 部分如下：

<div class="wrapper">
<iframe src="http://www.example.com"></iframe>
</div>

其中，`wrapper` 是一個父級元素容器，`iframe` 是嵌入在其中的框架。現在我們需要使用 CSS 來讓它居中。 方法一：定位法

.wrapper {
position: relative;
}
iframe {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}

這里使用了絕對定位來實現居中。首先，我們將 `wrapper` 設置為相對定位，以便讓它成為 `iframe` 的參照點。然后，我們把 `iframe` 的頂部和左側都設置為 50%。最后，我們使用 `transform` 屬性將 `iframe` 水平和垂直地向內移動 50%。 方法二：Flexbox法

.wrapper {
display: flex;
align-items: center;
justify-content: center;
height: 100vh;
}
iframe {
max-width: 90%;
max-height: 90%;
}

在父級容器 `wrapper` 上使用了 Flexbox 屬性。我們將它設置為 `display: flex`，并添加了 `align-items: center` 和 `justify-content: center`。這將使子元素（`iframe`）垂直和水平都居中。我們還為 `wrapper` 添加了 `height: 100vh`，以使其鋪滿整個屏幕。最后，我們設置了 `iframe` 的最大寬度和最大高度，以便使其適應不同大小的屏幕。 以上就是 CSS 中如何使嵌入式框架（iframe）居中的兩種方法。它們都相對簡單易懂，根據具體情況選擇適合自己的方法即可。