首页 > 开发学院  >  前端  > 

前端

css中translate函数的用法

时间:2023-05-26 12:51:47阅读数:0

1、translate允许单独声明平移变换,并独立于transform属性。

2、这在一些典型的用户界面上更好用,而且这样就无需在transform中声明该函数并记住转换函数的确切顺序了。

css translate实例

.wrapper {
     width: 200px;
     height: 200px;
     border: 2px dotted red;
     margin: 20px auto;
}
.wrapper div {
     width: 200px;
     height: 200px;
     line-height: 200px;
     text-align: center;
     background: orange;
     color: #fff;
     -webkit-transform: translate(50px,100px);
     -moz-transform:translate(50px,100px);
     transform: translate(50px,100px);
}