如果边框层动画未从中心进行缩放,可以使用transform-origin属性来指定缩放的中心点。以下是一个示例代码:
HTML:
CSS:
.box {
width: 200px;
height: 200px;
border: 2px solid blue;
animation: scale 2s infinite;
transform-origin: center;
}
@keyframes scale {
0% {
transform: scale(1);
}
50% {
transform: scale(1.5);
}
100% {
transform: scale(1);
}
}
在上面的示例中,我们使用transform-origin: center;
来将缩放的中心点设置为正中心。这样,边框层动画将从中心进行缩放。
下一篇:边框超出了div元素