transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜。

用法：object.style.transform="rotate(7deg)"

1、旋转： rotate(30deg);（顺时针旋转30°）

2、2D移动：translate(x,y)（右移到x，下移到y）

3、3D移动：translate3d(x,y,z)

4、横向移动：translateX(x)（横向移动到x）

5、竖向移动：translateY(y)（竖向移动到y）

6、缩放：scale(x,y)（以元素中心为中心，横向放大x倍，竖向放大y倍）

7、横向缩放：scaleX(2)（横向放大2倍）

8、竖向缩放：scaleY(5)（竖向放大5倍）

详情及效果参考： http://www.w3school.com.cn/cssref/pr_transform.asp

css-移动&缩放元素的更多相关文章

  1. 浅谈css的伪元素::after和::before

    css中的::after和::before已经被大量地使用在我们日常开发中了,使用他们可以使我们的文档结构更加简洁.但是很多人对::after和::before仍不是特别了解,究竟他们是做什么的?如何 ...

  2. 用 CSS 隐藏页面元素

    用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0 将 visibility 设为 hidden 将 display 设为 none 将 position 设为 absolute ...

  3. HTML和CSS设置动态导航以及CSS中伪元素的简单说明

    HTML页面代码: <!DOCTYPE html> <html> <head> <title>Test</title> <meta c ...

  4. CSS的伪元素（二）

    随便聊聊CSS的伪元素,虽然它们在项目开发中用的并不多,但确实很有用,在项目中不用它,是因为大家不能了解它们,下面是一个工作场景,如有四个按钮,分别是建立,编辑,删除和修改,而我们要求这在前台显示的汉 ...

  5. css的伪元素

    这里想将的是两个伪元素,一个是:first-line——用来向文本的首行添加特殊样式,并且不论该行出现多少单词:只能与块状元素关联. 如下属性可以应用于:first-line伪元素 font属性 co ...

  6. 用 CSS 隐藏页面元素的 5 种方法

    原文链接:用 CSS 隐藏页面元素的 5 种方法,转载请注明来源! 用 CSS 隐藏页面元素有许多种方法.你可以将 opacity 设为 0.将 visibility 设为 hidden.将 disp ...

  7. [CSS]利用伪元素实现一些特殊图形

    给定的html代码是: <div class='square'></div> 平常实现我们常是通过添加小的icon来实现,不仅需要添加图片资源,还需要改动html结构. CSS ...

  8. CSS Clip剪切元素动画实例

    1.CSS .fixed { position: fixed; width: 90px; height: 90px; background: red; border: 0px solid blue; ...

  9. css float父元素高度塌陷

    css float父元素高度塌陷 float 使父元素高度塌陷不是BUG,反而是标准. float 原本是为了解决文字环绕才出现的. 当然有的时候要解决高度塌陷的问题 以下几个方法可以解决float ...

  10. CSS实现父元素半透明，子元素不透明

    CSS实现父元素半透明,子元素不透明. 很久以来大家都习惯使用opacity:0.5在新式浏览器里实现半透明,而对IE较旧的版本使用filter:Alpha(opacity=0.5)的滤镜来实现半透明 ...

随机推荐

  1. Winform MD5

    1:MD5 http://www.cmd5.com/ 字节数组----字符串 //将字节数组中每个元素按照指定的编码格式解析成字符串//直接将数组ToString()//将字节数组中的每个元素ToSt ...

  2. querySelector()与querySelectorAll()

    1.querySelector() 参数:css选择器 返回匹配指定css选择器元素的第一个子元素 2.querySelectorAll() 参数:css选择器 返回匹配指定css选择器的所有元素

  3. python碎片记录(一)

    1.python中求幂运算 2**31-1     2的31次方减一(32位整型数据范围为-2^31~2^31-1,最高位为符号位,负向值比正向值绝对值大1) 2.python中整数除法 x=x//1 ...

  4. [转]python os模块 常用命令

    python编程时,经常和文件.目录打交道,这是就离不了os模块.os模块包含普遍的操作系统功能,与具体的平台无关.以下列举常用的命令 1. os.name()——判断现在正在实用的平台,Window ...

  5. rabbitmq之核心构架和原理总结（四）

    前言 前面博文已经将安装配置和站点管理介绍了,现在开始正式学习rabbitmq的使用了: rabbitMQ的构架 rabbitmq作为消息队列,一条消息从发布到订阅消费的完整流程为: 消息 --> ...

  6. 【R语言学习】时间序列

    时序分析会用到的函数 函数 程序包 用途 ts() stats 生成时序对象 plot() graphics 画出时间序列的折线图 start() stats 返回时间序列的开始时间 end() st ...

  7. 增大dma的分配

    前言 项目中需要通过驱动与fpga通讯,获取fpga往内存里写的数据.因为数据量比较大,需要驱动分配600多M的内存给fpga来写数据,且因为是与fpga通讯,需要连续的内存,还得是uncached的 ...

  8. python爬虫模块之调度模块

    调度模块也就是对之前所以的模块的一个调度,作为一个流水的入口. 下面的代码的获取数据部分暂时没有写,细节部分在实际开发中,要根据要求再定义,这里说的是使用方法 from savedb import D ...

  9. selenium.webdriver.common.keys 模块中常用的变量

    表11-5 selenium.webdriver.common.keys 模块中常用的变量属性 含义Keys.DOWN, Keys.UP, Keys.LEFT,Keys.RIGHT 键盘箭头键Keys ...

  10. HighGUI图形图像界面初步——鼠标操作

    OpenCV中的鼠标操作和滑动条的消息映射方式很类似,都是通过一个中介函数配合一个回调函数来实现的,创建和指定滑动条回调函数为createTrackbar, 而指定鼠标操作消息回调函数的函数为setM ...