項(xiàng)目中的一個(gè)動(dòng)效需要用到過(guò)度css屬性
transition，由此發(fā)現(xiàn)這個(gè)功能真的非常神奇，但是網(wǎng)上對(duì)這一屬性的介紹有些模糊，因此特總結(jié)如下，以備后查。
transition是什么？
是css過(guò)度動(dòng)效屬性，用來(lái)讓元素變化的有一個(gè)過(guò)程而不至于突然出現(xiàn)或者改變樣式，感官效果好。
transition怎么用？
- 有四個(gè)變量，可以單獨(dú)設(shè)置：
| 值 | 描述 |
|---|---|
| transition-property | 規(guī)定設(shè)置過(guò)渡效果的 CSS 屬性的名稱 |
| transition-duration | 規(guī)定完成過(guò)渡效果需要多少秒或毫秒 |
| transition-timing-function | 規(guī)定速度效果的速度曲線 |
| transition-delay | 定義過(guò)渡效果何時(shí)開(kāi)始 |
- 通常用法：
transition: all .28s ease;這里all指所有設(shè)置的變化，.28s是運(yùn)動(dòng)完成的時(shí)間，ease是運(yùn)動(dòng)的過(guò)程（動(dòng)效）設(shè)置。
使用舉例
.Star{
position: absolute;
top: 25px;
right: 25px;
box-shadow: 5px 5px 5px #888888;
transition: all .28s ease;
}
THE END
