CSS是一種用于網頁設計的語言,可以通過它來設置網頁的樣式和布局。其中一種比較有趣的效果是讓一個div抖動。下面介紹如何使用CSS來實現div抖動:
div { position: relative; animation: shake 0.5s; } @keyframes shake { 0% { left: 0; } 10% { left: -10px; } 20% { left: 10px; } 30% { left: -10px; } 40% { left: 10px; } 50% { left: -10px; } 60% { left: 10px; } 70% { left: -10px; } 80% { left: 10px; } 90% { left: -10px; } 100%{ left: 0; } }
首先,在CSS中定義需要抖動的div,并設置其position為relative,這是為了讓后面的動畫效果能夠生效。然后,在CSS的@keyframes關鍵字中定義抖動動畫的過程,使用left屬性來使div左右移動。在動畫過程中,通過10%、20%、30%等來控制div的左右移動,最后在100%時讓div回到原位置。最后,將動畫效果添加到div的樣式中,通過animation屬性來引用剛定義的shake動畫。
可以根據實際需要來調整動畫的時間和左右移動的距離,以達到想要的效果。
上一篇mysql5.1 分區表
下一篇mysql5.1 6下載