在網頁設計中彈出窗口是一個非常常見的元素，它可以用來進行各種類型的用戶交互和通知，比如登錄框、提示框等等。在 CSS 中，我們可以通過使用 position 和 top/bottom/left/right 屬性來實現彈出窗口的定位，下面我們來看一下如何讓彈出窗口在頁面中居中。

.popup{
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80%;
}

上述代碼定義了一個名為 popup 的彈出窗口元素。position 屬性被設置為 fixed，使得元素的位置相對于瀏覽器窗口固定不變。top 和 left 屬性分別被設置為 50%，使得彈出窗口的中心點定位在屏幕中心。最后，通過 transform 屬性的 translate 函數來讓元素自身的中心點也定位于屏幕中心點，從而實現了居中效果。

需要注意的是，為了讓彈出窗口占據屏幕寬度的 80%，我們必須在 CSS 中給這個元素設置一個合適的寬度，這里我們將其設置為 80%。

使用上述代碼，我們可以方便地實現彈出窗口居中的功能，不論在哪個屏幕分辨率下都可以得到理想的效果。