CSS是前端開發中的一項重要技能，其中讓DIV邊框動態是網頁制作中常見的一種效果，下面就介紹一下如何做到這一點。

div {
width: 200px;
height: 200px;
border: 1px solid #000;
position: relative;
}
div:before {
content: '';
position: absolute;
top: -1px;
left: -1px;
right: -1px;
bottom: -1px;
border: 1px solid #000;
animation: borderAnimation 1s linear infinite;
}
@keyframes borderAnimation {
0% {
transform: scale(1);
}
50% {
transform: scale(1.5);
}
100% {
transform: scale(1);
}
}

首先，我們需要給div設定好寬、高和邊框。接著，在div的偽元素:before中，我們需要設定好內容content為空，以及position為absolute，使得它可以占據到整個div的范圍。同時，我們也需要給它一個與div邊框相同的邊框，然后利用transform屬性中的scale實現放大和縮小的效果。

接著，我們需要使用CSS3中的動畫animation屬性，在@keyframes中指定三個狀態，在0%和100%處都是初始狀態，即scale為1，而在50%處，我們將scale設定為1.5，就能實現放大的效果。最后，我們將這個動畫屬性放入偽元素的before樣式中，讓它無限循環運動。

通過這種方法，我們就能夠很好地讓div邊框動態了，讓網頁更具有生動感，同時也提高了用戶對網頁的粘性。