在 CSS 中，我們可以使用 hover 偽類來實現(xiàn)鼠標移上去彈出框的效果。

.box {
position: relative;
}
.popover {
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
display: none;
}
.box:hover .popover {
display: block;
}

我們首先給外層元素（例如一個按鈕或者圖片）添加 position: relative，為彈出框設(shè)置 position: absolute，并且讓它相對于外層元素的底部位置展示（通過 top: 100% 實現(xiàn)）。

接下來，我們讓彈出框相對于自身垂直居中，并且讓它始終處于外層元素的中心位置（通過 left: 50% 和 transform: translateX(-50%) 實現(xiàn)）。

最后，當鼠標移上去外層元素時，彈出框就會顯示出來了（通過 .box:hover .popover 來控制）。

完整的 HTML 和 CSS 代碼如下：

<div class="box">
<button>Hover Me</button>
<div class="popover">
<p>This is a popover</p>
</div>
</div>
.box {
position: relative;
}
.popover {
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
display: none;
padding: 10px;
background-color: #f1f1f1;
}
.box:hover .popover {
display: block;
}

上述代碼中，我們還為彈出框添加了一些額外的樣式，例如 padding 和背景顏色，以便使它看起來更加美觀。

當我們將鼠標移上去按鈕時，彈出框就會在下面顯示出來，非常方便。