了解如何使用CSS3快速輕鬆地添加發光效果

將重點添加到網頁元素以強調

添加到網頁元素上的柔和的外部輝光會使元素突出顯示給觀眾。 使用CSS3和HTML在重要對象的外部邊緣上應用輝光。 效果類似於在Photoshop中添加到對像中的外部光暈。

首先創建發光元素

發光效果可以在任何顏色背景上完成,但是在黑暗背景下它們看起來最好,因為那樣發光似乎更閃亮。 在這個圓角矩形框示例中,DIV元素被放置在另一個黑色背景的DIV元素中。 外部DIV對於發光來說不是必需的,但很難在白色背景上看到發光。

給DIV一發光:


設置元素的大小和顏色

選擇要用輝光點綴的元素後,請繼續添加所需的任何樣式 ,例如背景顏色,大小和字體。 這個例子是一個藍色的矩形; 大小設置為147px×90px; 並且背景顏色被設置為#1f5afe,一種皇家藍色。 它包含一個將元素放置在黑色容器元素中間的邊距。