css中缩放是使用 transform来控制，参数可为scale、scaleX、scaleY等，但常规的缩放总以中心点为基准点，在很多时候都是很不方便的。
使用transform-origin来进行控制，使用transform-origin属性，可以改变缩放的基准点。
transform-origin: 10px 10px; // 定义缩放原点,相对于左上角的距离x、y，单位px
- 参数一：left、center、right，参数二：top、center、bottom。
- 具体的像素值；
css中缩放是使用 transform来控制，参数可为scale、scaleX、scaleY等，但常规的缩放总以中心点为基准点，在很多时候都是很不方便的。使用transform-origin来进行控制，使用transform-origin属性，可以改变缩放的基准点。transform-origin: 10px 10px; // 定义缩放原点,相对于左上角的距离x、y，单位px参数可使用值...
zoom和scale这两个东西都是用于对元素的缩放，但两者除了兼容性之外还有一些不同的地方。
zoom缩放会将元素保持在左上角，而scale默认是中间位置，可以通过transform-origin来设置。
另外他们执行的渲染顺序也不同zoom可能影响到盒子的计算。
我们看个例子
这是几行伪代码
缩放，指的是“缩小”和“放大”。在CSS3中，我们可以使用scale()方法来将元素根据中心原点进行缩放。
跟translate()方法一样，缩放scale()方法也有3种情况：
（1）scaleX(x)：元素仅水平方向缩放（X轴缩放）；
（2）scaleY(y)：元素仅垂直方向缩放（Y轴缩放）；
（3）scale(x,y)：元素水平方向和垂直方向同时缩放（X轴和Y轴同时缩放）；
1、scaleX(x)
transform:scaleX(x)
位置 transform:translate(100px);
宽高(
缩放 scale) transform:
scale(1.5,1.5);
旋转(旋转 rotate) transform:rotate(45deg);
控制
中心点(原点 origin) transform-origin:150px 100px;
动画 (transition) transition:all .5s ease-in 0s;
<!DOCTYPE html>
<html lang="zh-CN">
在CSS3中，可以利用 transform ( 变形 ) 功能来实现文字或图像的旋转、缩放、倾斜、移动这四种类型的变形处理，本文将对此做详细介绍。
一. 旋转 rotate
用法：transform: rotate(45deg);
共一个参数“角度”，单位deg为度的意思，正数为顺时针旋转，负数为逆时针旋转，上述代码作用是顺时针旋转45度。
二. 缩放 scale
用法：transform: scale(0.5) 或者 transform: scale(0.5, 2)
const cover = require ( 'canvas-cover-image' ) ;
const Canvas = require ( 'canvas' ) ;
const Image = Canvas . Image ;
const canvas = new Canvas ( 640 , 480 ) ;
const ctx = canvas . getContext ( '2d' ) ;
const img ;
fs . readFile ( __dirname + '/images/squid.png' , function ( err , sq
在PC端用1px的边框线，看起来还好，但在手机端看起来就很难看了，而0.5px的分割线会有种精致的感觉。用普通写法border:solid 0.5px red;iPhone可以正常显示，android下几乎所有的浏览器都会把0.5识别为0，即无边框状态.
原理就是给需要加边框的元素插入一个伪类，伪类采用绝对定位，然后对伪类添加1px边框，最后进行0.5倍
缩放。
transform的
缩放和旋转默认都是按照元素的
中心点来操作的
outline元素在
缩放0.5之前尺寸就是红框元素，
缩放后，位置到了红框中心，为了使之依然在左上角，
缩放之前我们需进行left：-50%；top：-50%的位移。
一、过渡（transition）
过渡（transition）是CSS3中具有颠覆性的特性之一，我们可以在不使用Flash动画或JavaScript的情况下，当元素从一种样式变换为另一种样式时为元素添加效果。
过渡动画：是从一个状态渐渐的过渡到另外一个状态。
可以让我们页面更好看，更动感十足，虽然低版本浏览器不支持（ie9以下版本）但是不会影响页面布局。
经常和:hover一起搭配使用。
语法：transition：要过渡的属性 花费时间 运动曲线 何时开始；
属性（必须写）：想要变化的css属性，
