CSS鼠標(biāo)移動上去有黑框是一種常見的設(shè)計效果，可以提升網(wǎng)頁的用戶體驗和頁面美感。這種效果可以通過CSS代碼來實現(xiàn)，具體方法如下。

/* HTML部分 */ 
<div class="box">
<img src="圖片地址" alt="圖片描述">
</div>
/* CSS部分 */ 
.box {
position: relative;
display: inline-block;
}
.box:hover::before {
content: '';
position: absolute;
top: 5px;
left: 5px;
bottom: 5px;
right: 5px;
border: 1px solid black; /* 黑色邊框 */
}
/* :hover 為鼠標(biāo)移動到元素上時的偽類選擇器，::before 是在元素前方添加內(nèi)容的偽元素 */

在上面的代碼中，我們首先給包裹圖片的容器設(shè)置了相對定位和內(nèi)聯(lián)塊級元素的display屬性，以保證圖片和邊框的相對位置不會變化。然后，在容器元素的:hover狀態(tài)下，通過::before偽元素在容器前面添加了一個空白的方塊，通過border屬性給方塊添加了一個黑色的邊框。

需要注意的是，為了讓黑框和圖片有一定的間隙，我們在給黑框定位時通過top、left、bottom、right屬性分別設(shè)置了5px的外邊距。

綜上所述，通過利用CSS的偽元素和 :hover 選擇器，我們可以很方便地為網(wǎng)頁中的圖片、按鈕等元素添加動態(tài)邊框效果，實現(xiàn)出更美觀的頁面效果。