day16知识点
很多css3属性 最初的预览版没有形成最终的正式版，但是浏览器为了对这些新属性形成支持，主流浏览器提供属于自己的语法规则 “浏览器前缀”
-webkit- 谷歌、苹果 浏览器前缀
-moz- 火狐浏览器前缀
-ms- IE浏览器前缀
-o- 欧鹏浏览器
注：
添加浏览器前缀 -> 兼容模式
不添加浏览器前缀 -> 标准模式
一、渐变 渐变？：背景在多个颜色之间平稳的过度
线性渐变： 从一个方向到另一个方向的颜色的变化
标准模式的语法（不添加浏览器前缀）：
background：linear-gradient（direction，color-stop1，color-stop2，…等等 ）
说明： direction：默认为to bottom， 即从上向下的渐变
stop：颜色的分布位置，默认均分分布列如有三个颜色，各个颜色的stop均为33.33%
兼容模式语法（添加浏览器后缀）
background：-webkit- linear-gradient（direction，color-stop1，color-stop2，等等）
说明：direction：不能添加to 默认指的哪 从那个方向开始
渐变方向 to left\right\top\
对着角渐变 ： to left top \ to right bottom
渐变角度的变化 列如：标准模式： 40deg（40度） 兼容模式 ： （90-40=50度） 等于标准模式的40度
线性渐变：颜色的分布：
linear-gradient（方向，颜色1（20%）颜色2（30%）颜色3） 到20%这个位置仍然是颜色1 出了20% 开始向颜色2渐变
径向渐变：从一个点到四周的过度渐变
语法：（必须添加浏览器前缀）
background：—wedkit—linear-gradient（center，shape，size，…，last-color）
说明：center：渐变起点的位置，可以为百分比，默认是图形的正中心
shape：渐变的形状，ellipse表示椭圆形，circle表示圆形。默认为cellpse，如果元素形状为正方形的元素，则ellispe和circle显示一样
size：渐变的大小，即渐变到哪里停止，他有四个值。closest-side（最近边）farthest-side：（最远变）closest-side（最近角） farthes-corner：（最远角）
关于径向渐变的大小：
closest-side 最近边
farthest-side 最远边
closest-corner 最近角
farthest-corner 最远角
重复性渐变：
重复性线性渐变：background:repeating-linear-gradient();
重复性径向渐变：background:repeating-radial-gradient();
二、过度
语法 transition-property：检索或设置对象中的参与过渡的属性
transition-duration：检索或设置对象过渡的持续时间
transition-delay：检索或设置对象延迟过渡的时间
transition-timing-function：检索或设置对象中过渡的动画类型
动画的运动类型： 默认的不是匀速 ，默认的是ease
简写属性：transition：过度的属性（all） 过度的时间 延迟时间 动画的类型（linear 均速）
注：transition 必须通过事件触发（鼠标滑过：hover） 改变css属性
