我對css3 transition屬性的渲染速度有疑問。假設我有許多要素：div, span, a {transition: all}div {margin: 2px}span {opacity: .5}a:hover {background-position: left top}div:hover {margin: -100px}span:hover {opacity: 1}a:hover {background-position: -5px top}使用一個聲明將所有這些元素的所有轉換作為目標更有效div, span, a {transition: all}。但是我的問題是：針對每個元素的特定過渡屬性，在動畫渲染的平滑度和快速度方面是否“更快”？例如：div {margin: 2px; transition: margin .2s ease-in}span {opacity: .5; transition: opacity .2s ease-in}a {background-position: left top; transition: background .2s ease-in}div:hover {margin: -100px}span:hover {opacity: 1}a:hover {background-position: -5px top}我這樣做的邏輯是，即使一個元素只有一個屬性，css的“引擎”是否必須搜索“所有”過渡屬性，也可能會減慢速度。有誰知道是這樣嗎？謝謝！
3 回答
桃花長相依
TA貢獻1860條經驗 獲得超8個贊
我一直all在需要為多個規則設置動畫的情況下使用。例如，如果我想更改color＆background-coloron :hover。
但是事實證明，您可以將多個規則定位為過渡條件，因此您無需訴諸該all設置。
.nav a {
transition: color .2s, text-shadow .2s;
}
寶慕林4294392
TA貢獻2021條經驗 獲得超8個贊
這實際上不是對原始問題的答案。是的，您可能會意外地轉換原本不想設置動畫的內容，但是OP詢問“所有”規則是否會導致任何性能下降，前提是未觸發任何意外轉換。
添加回答
舉報
0/150
提交
取消