CSS如何實現div閃爍

在css中，可以使用「@keyframes」規則和animation屬性來實現div閃爍效果；只需先使用「@keyframes」建立具有閃爍效果的動畫；然後使用animation屬性來設定動畫所需時間，速度以及次數等。

本教學操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。

效果圖如下

程式碼如下

@keyframes fade {
    from {        
    opacity: 1.0;    
    }
    50% {        
    opacity: 0.4;    
    }
    to {        
    opacity: 1.0;    
    }
}
@-webkit-keyframes fade {    
    from {        
    opacity: 1.0;    
    }
    50% {        
    opacity: 0.4;    
    }
    to {        
    opacity: 1.0;    
    }
}
.headerBox {    
    color: #fff;    
    padding: 10px;    
    font-size: 15px;    
    height: 60px;    
    animation: fade 600ms infinite;    
    -webkit-animation: fade 600ms infinite;
}

給div設定headerBox 樣式即可

推薦學習：css影片教學

以上是CSS如何實現div閃爍的詳細內容。更多資訊請關注PHP中文網其他相關文章！