CSS3是一種跨平臺(tái)的樣式表語(yǔ)言，它可以使網(wǎng)站設(shè)計(jì)更加靈活。其中一個(gè)很酷的功能是使元素左右來(lái)回移動(dòng)。下面我們來(lái)看一下如何實(shí)現(xiàn)這個(gè)效果。

/* 定義動(dòng)畫關(guān)鍵幀 */
@keyframes move {
0% {left:0px;}
50% {left:200px;}
100% {left:0px;}
}
/* 設(shè)置元素的樣式 */
div {
position:absolute;
width:100px;
height:100px;
background-color:red;
animation: move 2s linear infinite;
}

如上所示，我們首先定義了一個(gè)名為move的關(guān)鍵幀，它將元素從左側(cè)移動(dòng)到右側(cè)，然后再移回來(lái)。然后我們給元素設(shè)置了樣式并將動(dòng)畫應(yīng)用到它身上。最后，通過(guò)設(shè)置動(dòng)畫的參數(shù)，我們讓它一直重復(fù)播放。

這個(gè)動(dòng)畫效果非常簡(jiǎn)單但卻很妙，能夠?yàn)槟愕木W(wǎng)站帶來(lái)一些生動(dòng)的感覺(jué)。如果你想要體驗(yàn)一下這個(gè)動(dòng)畫效果，可以將上面的代碼復(fù)制到你的CSS文件中，并在HTML文件中添加一個(gè)div元素。