4.2 屬性 transition-property

說明

指定某一個或多個 css 屬性，套用轉場效果，例如寬度( width )在 A 狀態是 100px，而 B 狀態是 200px，那轉場就會是寬度從 100px 漸進增加至 200px。

常見可設定的值

• all：這是預設，會試圖將所有可以轉場效果的 css 屬性，都直接套用。

• none：任何 css 屬性都不會套用轉場效果。

• property：這裡是指特定 css 屬性套用轉場效果，例如 width、transform、opacity 等，只要是可以形成數值變化的都可以。

以 3.1 的例子來看，有設定 transition 轉場效果的，有 width、height、border-radius 。

範例

觀察，將：

transition: border-radius 2s, width 2s, height 2s;

改成：

transition: all 2s;