transform-origin: 50% 127.312px
时间: 2024-01-25 17:12:48 浏览: 110
利用CSS3的transform做的动态时钟效果
`transform-origin`是CSS属性,用于指定元素变换的原点。它定义了元素变换的中心点,即元素围绕该点进行旋转、缩放、倾斜等变换操作。
在你提供的引用中,并没有提到`transform-origin: 50% 127.312px`这个具体的用法和示例。但是我可以为你提供一个示例来演示`transform-origin`的使用:
```html
<!DOCTYPE html>
<html>
<head>
<style>
.box {
width: 200px;
height: 200px;
background-color: red;
transform: rotate(45deg);
transform-origin: 50% 127.312px;
}
</style>
</head>
<body>
<div class="box"></div>
</body>
</html>
```
在上面的示例中,我们创建了一个宽高为200px的红色方块,并对其应用了`rotate(45deg)`旋转变换。`transform-origin: 50% 127.312px`指定了变换的中心点为元素的水平中心点(50%)和垂直偏移量为127.312px的位置。
这样,当我们运行这段代码时,方块将围绕指定的中心点进行旋转变换。
阅读全文