-
Notifications
You must be signed in to change notification settings - Fork 6
Open
Description
CSS 函数 scale() 用于定义元素的缩放值来放大或缩小元素,当其只有一个参数时,元素会等比缩放。这里有个鲜为人知的技巧是:它的参数值可以为负数。当为负数时,元素会左右、上下翻转(效果和 rotate(180deg) 一样),然后进行缩放。那如果我们定义了 scale 的值从正整数到负整数过渡会如何?效果就是实现了元素在翻转的同时缩放。
<p class="scale">The quick brown fox jumps over the lazy dog.</p>.scale {
font-size: 30px;
text-align: center;
transform: scale(1);
animation: scale 5s infinite linear;
}
@keyframes scale {
50% { transform: scale(-1); }
100% { transform: scale(-1); }
}Metadata
Metadata
Assignees
Labels
No labels