为了账号安全,请及时绑定邮箱和手机立即绑定

css的转换的基本知识的记录

标签:
Html/CSS Html5

1、转换
1、什么是转换
转换即改变元素的一些状态,大小、位置、形状
可以是2d转换,也可以是3d的转换
2d : 使元素在 x轴和 y轴上发生变化
3d :2d基础上增加了 z轴的变化
2、转换属性
CSS3转换属性:
transform : none / transform-function;
none:不转换,默认值
transform-function:表示要实现转换的函数
旋转:rotate()
位移:translate()
缩放:scale()
transform:rotate(); -- 旋转操作
3、转换原点:
转换原点:即转换过程中围绕的中心点。
默认情况下,原点是在整个元素的中间处
更改转换原点:
transform-origin:
取值 :
数值 :以元素左上方的点为(0,0),再去计算其他点
百分比:
0% , 0% : 左上方的点
50% , 50% :元素的中心点
关键字:
left
right
top
bottom
center
left top : 表示左上方
transform-origin赋值:
一个值 :x轴的移动
两个值 :x轴和y轴
三个值 :x轴,y轴,z轴

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消