过渡的必要前提是：一定要有事件发生：click hover等等。
transition-property 值：
none 没有属性值改变。
all 默认，所有属性值都改变
translate(这是第一个属性名称property，指定一个属性名) 指定需要改变的属性名，多个用逗号隔开
trasition-duration 值：
2s/ms 指定过渡的时间，秒或毫秒
CSS3过渡是元素从一种样式逐渐改变为另一种的效果，要实现这一点，必须规定：指定效果的持续时间
transition-timing-function 值：
linear 线性 匀速运动。
ease 平滑过渡 开始慢-中间比较快-结束慢。
ease-in 慢-快
ease-out 快-慢
ease-in-out 开始慢--中间快--结束慢 最理想的运动曲线。
transition-delay 值：
1s/ms 指定开始过渡之前的延迟时间/返回过渡之前的延迟时间
.one{
/*默认这个必须写以下代码，如果这个没写，那么鼠标离开时，就会瞬间秒回原来位置*/
-webkit-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-moz-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-ms-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-o-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
}
.one:hover{ /**/
/*这个可以省略，但是为了浏览器兼容，这个最好也要写*/
-webkit-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-moz-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-ms-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-o-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
}
transition-property的属性有三个值：
1，none 没有属性改变。
2，all 所有属性都改变，默认值。
3，property 元素属性名称。如下：
---------
.one{
100px;
height: 100px;
background: -webkit-linear-gradient(green,yellow,blue);
background: -moz-linear-gradient(green,yellow,blue);
background: -ms-linear-gradient(green,yellow,blue);
background: -o-linear-gradient(green,yellow,blue);
background: linear-gradient(green,yellow,blue);
transition: transform .5s ease-out;
-webkit-transition-property: background; 蓝色部分是为了保证浏览器兼容性而设定的，过度属性和鼠标悬浮都必须写。
-moz-transition-property: background;
-ms-transition-property: background;
-o-transition-property: background;
transition-property: background;
}
.one:hover{ /*一定要有事件发生*/
cursor: pointer;
background: -webkit-linear-gradient(blue,orange,yellow,purple);
background: -moz-linear-gradient(blue,orange,yellow,purple);
background: -ms-linear-gradient(blue,orange,yellow,purple);
background: -o-linear-gradient(blue,orange,yellow,purple);
background: linear-gradient(blue,orange,yellow,purple);
-webkit-transition-property: background;
-moz-transition-property: background;
-ms-transition-property: background;
-o-transition-property: background;
transition-property: background;
}
---------
transition-duration: time;规定完成过渡效果需要花费的时间，以秒或毫秒计，需要设置时间单位，默认值是 0，意味着不会有效果.
-webkit-transition-duration: 2s;
-moz-transition-duration: 2s;
-ms-transition-duration: 2s;
-o-transition-duration: 2s;
transition-duration: 2s;
--------------------------------
transition-timing-function，主要使用的值：linear , ease , ease-in , ease-out , ease-in-out 这五个属性值，其他暂时不考虑。
以上几个属性值暂时不考虑，只做了解。
-----------------------------
-webkit-transition-delay: .5s;/*鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，*/
-moz-transition-delay: .5s;/*鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，*/
-ms-transition-delay: .5s;/*鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，*/
-o-transition-delay: .5s;/*鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，*/
transition-delay: .5s;/*鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，*/
------------------------------
-webkit-transition: all 2s ease-in-out 1s;
-moz-transition: all 2s ease-in-out 1s;
-ms-transition: all 2s ease-in-out 1s;
-o-transition: all 2s ease-in-out 1s;
transition: all 2s ease-in-out 1s;
-webkit-transition: all 2s ease-in-out 1s;
-moz-transition: all 2s ease-in-out 1s;
-ms-transition: all 2s ease-in-out 1s;
-o-transition: all 2s ease-in-out 1s;
transition: all 2s ease-in-out 1s;
=======================================
下面是一个过渡实例：
transition实例：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
*{
padding: 0;
margin: 0;
border: none;
font-family: "微软雅黑";
font-size: 16px;
}
.container{
1000px;
height: 500px;
margin: 0 auto;
padding-top: 100px;
border: 1px solid red;
}
.one{
100px;
height: 100px;
transform: rotate(0deg) translate(0,0) scale(1) skew(0,0);
-webkit-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-moz-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-ms-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
-o-transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
transition: all 2s ease-in-out 1s;/*以下简写，鼠标离开时，回来的过渡效果，如果不写，则瞬间秒回*/
/* -webkit-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-moz-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-ms-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-o-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-webkit-transition-duration: 2s;过渡时间持续2秒
-moz-transition-duration: 2s;过渡时间持续2秒
-ms-transition-duration: 2s;过渡时间持续2秒
-o-transition-duration: 2s;过渡时间持续2秒
transition-duration: 2s;过渡时间持续2秒
-webkit-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-moz-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-ms-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-o-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-webkit-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
-moz-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
-ms-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
-o-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他， */
background: radial-gradient(green,yellow,blue);
}
.one:hover{
cursor: pointer;
-webkit-transition: all 2s ease-in-out 1s;/*如果不写这个也可以正常进行一个过渡，但对象样式本身必须写。*/
-moz-transition: all 2s ease-in-out 1s;/*如果不写这个也可以正常进行一个过渡，但对象样式本身必须写。*/
-ms-transition: all 2s ease-in-out 1s;/*如果不写这个也可以正常进行一个过渡，但对象样式本身必须写。*/
-o-transition: all 2s ease-in-out 1s;/*如果不写这个也可以正常进行一个过渡，但对象样式本身必须写。*/
transition: all 2s ease-in-out 1s;/*如果不写这个也可以正常进行一个过渡，但对象样式本身必须写。*/
/* -webkit-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-moz-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-ms-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-o-transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
transition-property:background, transform;设置要过渡的属性名称,多个使用逗号隔开
-webkit-transition-duration: 2s;过渡时间持续2秒
-moz-transition-duration: 2s;过渡时间持续2秒
-ms-transition-duration: 2s;过渡时间持续2秒
-o-transition-duration: 2s;过渡时间持续2秒
transition-duration: 2s;过渡时间持续2秒
-webkit-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-moz-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-ms-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-o-transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
transition-timing-function: ease-in-out;运动曲线，先慢--快--慢
-webkit-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
-moz-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
-ms-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
-o-transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他，
transition-delay: .5s;鼠标悬停和鼠标悬停后移开时，延迟0.5秒 在执行其他， */
background: linear-gradient(blue,orange,yellow,purple);
transform: rotate(360deg) translate(300px,300px) scale(2) skew(45deg,-33deg);
}
</style>
</head>
<body>
<div class="container">
<div class="one">我爱你</div>
</div>
</body>
</html>
=====================
PHP的时间函数date()
//使用date()函数时，必须先设定时区：
date_default_timezone_set("Asia/Shanghai");
echo "today is ".date("y/m/d/h/i/s/sa")."<br>";
date() 函数的格式参数是必需的，它们规定如何格式化日期或时间。
下面列出了一些常用于日期的字符：
d - 表示月里的某天（01-31）
m - 表示月（01-12）
Y - 表示年（四位数）
1 - 表示周里的某天（这个英文L的小写l，不是数字1）
其他字符，比如 "/", "." 或 "-" 也可被插入字符中，以增加其他格式。
下面是常用于时间的字符：
h - 带有首位零的 12 小时小时格式
i - 带有首位零的分钟
s - 带有首位零的秒（00 -59）
a - 小写的午前和午后（am 或 pm）
如果从代码返回的不是正确的时间，有可能是因为您的服务器位于其他国家或者被设置为不同时区。
因此，如果您需要基于具体位置的准确时间，您可以设置要用的时区。
下面的例子把时区设置为 "Asia/Shanghai"，然后以指定格式输出当前时间：
date_default_timezone_set("Asia/Shanghai");
echo "today is ".date("y/m/d/h/i/s/a")."<br>"
//sa可以连写，表示:秒和pm/am
===============================
通过 PHP mktime() 创建日期----make time
语法：mktime(hour,minute,second,month,day,year);
如下：
$d=mktime(9, 12, 31, 6, 10, 2015);
echo "创建日期是 " . date("Y-m-d h:i:sa", $d);
//谨记$d不能使用引号。
--------
通过 PHP strtotime() 用字符串来创建日期
PHP strtotime() 函数用于把人类可读的字符串转换为 Unix 时间。
语法： strtotime(time,now) 如下：
date_default_timezone_set("Asia/Shanghai");//创建时间一定要先设定时区
$c=strtotime("10:30am October 14 2018");
echo "今天是：".date("y-m-d-h-i-sa",$c)."<br>";
---
//设定为上海时区
date_default_timezone_set("Asia/Shanghai");
//可以用next days,+/-n days/months/years/seconds/hours/minutes...
$d=strtotime("yesterday");
echo "明天的时间为：".date("y-m-d-h-i-l-sa",$d)."<br>";
$a=strtotime("-6 days");
echo "三个月后的时间为：".date("y-m-d-h-i-sa",$a)."<br>";