最原始有個樣式,

然后開始寫了這樣的變形:

.tooltip-effect-1 .tooltip-content {
?? ?-webkit-transform: translate3d(0,10px,0) rotate3d(1,1,1,45deg);
?? ?transform-origin: center bottom;
}

.tooltip-effect-1 .tooltip-content i {
?? ?transform: scale3d(0,0,1);
}
后來又這樣變形:
.tooltip:hover .tooltip-content, .tooltip:hover .tooltip-content i {
?? ?opacity: 1;
?? ?transform: translate3d(0,0,0) rotate3d(1,1,1,0) scale3d(1,1,1);
}

為什么后來的變形不是相對第一次變形再變回去,而是全部相對于初始清零呢

為什么不是這樣的代碼?

.tooltip:hover .tooltip-content, .tooltip:hover .tooltip-content i {
?? ?transform: translate3d(0,-10px,0) rotate3d(1,1,1,-45deg)
}