CSS3中引入了一個非常實(shí)用的特性——from to屬性，在許多地方都可以用得上。通過from to屬性，我們可以定義元素從一個狀態(tài)到另一個狀態(tài)的過渡效果，而這一切只需要使用CSS就可以輕松實(shí)現(xiàn)。

.box {
height: 100px;
width: 100px;
background-color: #f44336;
position: relative;
animation: myanimation 2s;
}
@keyframes myanimation {
from {
left: 0%;
}
to {
left: 50%;
}
}

假設(shè)我們有一個名為box的方形元素，現(xiàn)在我們想讓它從左側(cè)移動到屏幕中央，那么我們可以定義一個關(guān)鍵幀動畫keyframes，并設(shè)置from屬性來表示元素開始時的狀態(tài)，to屬性來表示元素結(jié)束時的狀態(tài)。在上述代碼中，我們定義了一個名為myanimation的動畫，并將其綁定到了box元素上。接著，我們使用from和to屬性分別設(shè)置了元素左側(cè)相對屏幕的位置，最后設(shè)置了動畫時長為2秒鐘。

這樣一來，我們的元素就會在2秒鐘內(nèi)從左側(cè)移動到屏幕中央。此外，from to屬性還可以用于定義元素的其他樣式，例如顏色，字體大小等等。只要有想象力，我們就能發(fā)揮出CSS3強(qiáng)大的特性。從而為網(wǎng)站帶來更加醒目的效果，提升用戶體驗(yàn)。