CSS的translate函数能做什么,有什么好处
Admin 2022-07-29 群英技术资讯 738 次浏览
在实际应用中,我们有时候会遇到“CSS的translate函数能做什么,有什么好处”这样的问题,我们该怎样来处理呢?下文给大家介绍了解决方法,希望这篇“CSS的translate函数能做什么,有什么好处”文章能帮助大家解决问题。
1、translate允许单独声明平移变换,并独立于transform属性。
2、这在一些典型的用户界面上更好用,而且这样就无需在transform中声明该函数并记住转换函数的确切顺序了。
实例
.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);
}
本文教程操作环境:windows7系统、css3版,DELL G3电脑。
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
这篇文章主要介绍了基于CSS模仿遥控器按钮的实现代码,大概思路是四个相同的正方形田字形布局,配合旋转属性即可。具体实现代码大家参考下本文
方法:1、用“@keyframes 动画名{100% {transform:rotate(角度)}”创建旋转动画;2、用“元素:hover{animation:动画名 时间 linear infinite}”设置在鼠标移上元素时触发动画。
本文主要介绍了纯html+css实现Element loading效果,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
因为在现在的大部分项目中很多都用到了滚动条,有时候用到模拟的滚动条,现在说下滚动条的CSS也能解决。比如网易邮箱的滚动条样子很好看,就是利用的CSS来设置的,而且是webkit浏览
前段时间在开发中,遇到需要给背景层加颜色遮罩的项目,现在特定总结一下给背景图层加颜色遮罩的方法,感兴趣的朋友跟随小编一起看看吧
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008