圖片周邊閃亮是一種常見的網頁效果，可以為頁面增添點綴，提高視覺效果。下面我們來學習如何通過CSS實現這一效果。

/* 創建圖片容器 */
.img-container {
position: relative;
}
/* 添加閃亮效果 */
.img-container::before {
content: "";
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
border: 2px solid #fff;
opacity: 0;
transition: opacity 0.5s ease-out;
}
/* 鼠標懸停時讓閃亮效果透明度增加 */
.img-container:hover::before {
opacity: 1;
}

以上CSS代碼可以使圖片周邊出現一個白色邊框，并同時添加了一個透明層，用于實現閃亮效果。當鼠標懸停在圖片上時，透明層的透明度會逐漸增加，從而產生閃亮效果。

這樣一個簡單的CSS樣式就可以讓你的圖片周邊閃亮起來，讓網頁更加生動有趣。