CSS發光擴散是一種非常流行的設計效果。它可以讓網頁元素看起來立體而有光澤。如何使用CSS實現發光擴散呢？下面會有詳細的介紹。

.box {
position: relative;
display: inline-block;
padding: 20px;
background-color: #fff;
box-shadow: 0 0 20px rgba(0,0,0,.2),inset 0 0 20px rgba(0,0,0,.2);
}
.box:before {
content: "";
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 20px;
z-index: -1;
background: radial-gradient(ellipse farthest-corner at center, rgba(250,250,250,0) 0%,rgba(250,250,250,0) 73%,rgba(250,250,250,.4) 76%,rgba(250,250,250,0) 100%);
}

上面是一個實現發光擴散的示例代碼。其中，首先需要給發光擴散的元素（比如例子中的“box”）設置“position: relative”屬性，以便使偽元素“box:before”能夠正確跟隨其位置。

其次，需要使用“before”偽元素來創建一個類似于“遮罩”的效果，以使發光擴散能夠被應用到當前的元素上。

在示例代碼中，我們使用了一個徑向漸變來創建發光擴散的效果。漸變的起始點在正中心，漸變的最大值在元素的四個角落。同時，我們利用“rgba”函數來設置透明度，從而使得發光效果看起來更加自然。

最后，需要使用“border-radius”屬性來設置偽元素的圓角。與元素本身的圓角相對應，這樣能夠讓發光擴散的效果看起來更加和諧順暢。

在使用CSS發光擴散時，需要注意不要濫用。這種效果雖然可以讓網頁看起來十分驚艷，但是如果使用不當，很容易影響網頁的加載速度和渲染效果。