在網頁設計中，我們經常需要對一些元素添加鼠標懸浮效果，以使網頁更加生動有趣。其中一種常見的效果就是鼠標經過CSS邊框變粗。下面我們將介紹如何實現這個效果。

<div class="box">
<p>這是一個段落</p>
</div>
<style>
.box {
border: 1px solid #999;
padding: 10px;
transition: border-width 0.5s;
}
.box:hover {
border-width: 5px;
}
</style>

在這段代碼中，我們首先創建了一個帶有邊框的盒子元素（class="box"），同時也創建了一個包含在盒子中的段落元素。接下來，在CSS樣式中，我們對盒子設置了一個1像素寬的邊框，并設置了包含在盒子中的元素的內邊距為10像素。同時，我們還添加了一個過渡效果，使得鼠標經過時邊框寬度的變化顯得更加平滑。

最后，我們在CSS樣式中定義了:hover偽類，使得當鼠標經過盒子元素時，邊框寬度會從1像素變成5像素，從而實現了鼠標經過CSS邊框變粗的效果。