CSS

CSS transition 的默认值

發布時間：2024/8/26 CSS 49 豆豆

生活随笔收集整理的這篇文章主要介紹了 CSS transition 的默认值小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

transition:?property duration timing-function delay|initial|inherit;

示例：

div?{width:?100px;height:?100px;transition:?width 2s; }div:hover?{width:?300px; }

CSS transition 演示

也可同時指定多個需要 transition 的屬性，每個屬性用逗號分隔，包含自己完整的時間，動畫方法（timing function）的指定。

div {width: 100px;height: 100px;transition: width,height 2s; }div:hover {width: 300px;height: 300px; }

CSS transition 同時作用于多個屬性

上面 width 只指定了屬性，未指定時間及動畫方法，所以動作的變化發是在瞬時完成的。

transition: all 0s ease 0s

意味著瀏覽器對所有元素所有屬性設置了 transitoin 但時長為 0。

所以實際使用中，只需要設置元素的 transition-duration 即可讓 transition 生效。

div {width: 100px;height: 100px; - transition: width,height 2s; + transition-duration: 2s; }div:hover {width: 300px;height: 300px; }

CSS transition 的默認值

以上是生活随笔為你收集整理的CSS transition 的默认值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。