css3前缀（浏览器兼容性）据我们了解，css3属性大部分支持ie10，部分支持ie9，少数支持ie8//prefix//-webkit-SafariandChrome(Apple,Google)//-moz-Firefox(Firefox)//-ms-IE9（IE浏览器）//-o-Opera（世界之窗）//例如ie兼容：//-ms-transform（转换）//-ms-transition（转换）//@-ms-keyframes(关键帧)//-ms-animation(动画)transform(转换)(ie9及以上支持，ie9需要加前缀-ms-)//transfrom属性的方法使用transform:scale(30,60);//缩放：X轴缩放30倍，Y轴缩放60倍，只有一个值时为XY缩放因子transform:skew(30deg,60deg);//倾斜：X轴倾斜30度，Y轴倾斜60度，只有一个值是X轴倾斜度transform:translate(30px,60px);//移动：X轴平移30px，Y轴平移60px，X轴平移距离只有一个值transform:rotate(30deg);//旋转：顺时针旋转30度transform:rotateX(30deg);//3D水平旋转：3DX轴顺时针翻转30度transform:rotateY(60deg);//3D垂直旋转：3DY轴顺时针翻转60度transform:matrix(1,0,0,1,0,0);//整体变换：(scaleX,tiltX,tiltY,scaleY,moveX,moveY)//注意：6个参数都是没有单位的值//1.ZoomXX轴缩放系数//2.TiltXX轴倾斜百分比（相对宽度）//3.TiltYY轴倾斜百分比（相对高度）//4.ZoomYY轴zoomfactor//5.MoveXXAxistranslationpixel//6.MoveYYaxistranslationpixel过渡（transition）（即10及以上支持）//属性名transition-duration:2s;//持续时间（默认为0s）transition-timing-function:linear;//过渡效果（曲线缓动（默认）/恒速线性）transition-delay:1s;//何时开始（默认为0s）transition:transform2slinear1s;//变换，时间2s，恒速，1s后开始@keyframes(keyframe)（ie10及以上支持）//-webkit-等前缀加在关键帧前//from~to@keyframescssName1{from{background：红色的;}到{背景：绿色；}}//0%~100%@keyframescssName2{0%{transform:translate(0);}25%{转换：翻译（-200px）；}50%{变换：翻译（0）；}75%{转换：翻译（200px）；}100%{转换：翻译（0）；}}animation（动画）（ie10及以上版本支持）animation-name:name;//动画名称animation-duration:2s;//持续时间（默认为0s）animation-timing-function:linear;//过渡效果（曲线缓动（默认）/恒速线性）animation-delay:1s;//什么时候开始（默认为0s）animation-iteration-count:infinite;//播放次数（1（默认）/无限播放）animation-direction:alternate;//向前和向后播放（正常向前（默认）/交替反向）animation-play-state:paused;//动画状态(runningmovement(default)/pausedpause)animation:name2slinear1sinfinitealternatepaused;//名称，时间2s，恒速，1s后开始，无限循环，反向，暂停css3其他属性css3border//ie9及以上支持border-radius:10px;//边框圆角//ie9及以上支持box-shadow:10px10px5px#999;//边框阴影（X轴偏移像素，Y轴偏移像素，模糊像素大小，颜色）//ie11及以上支持border-image:url(bg.jpg)3030round;//边框背景（背景，X轴，Y轴，可重复性）css3背景（ie9及以上支持）background-size:40%100%;//背景图像大小（像素或百分比缩放）background-origin:content-box;//背景图片定位区域(content-box,padding-box(默认),border-box)background-clip:content-box;//背景绘图区域(content-box,padding-box(default),border-box)css3text//ie10及以上支持text-shadow:3px2px1px#f00;//X轴，Y轴，模糊距离，Color（文字阴影）//ie8及以上支持word-wrap:break-word;//拆分长词并换行到下一行（英文换行）CSS3字体（ie9及以上支持）@font-face{font-family:myFirstFont;字体粗细：粗体；src:url('Sansation_Light.ttf'),url('Sansation_Light.eot');//IE9+}正文{font-family:myFirstFont;//定义字体名称}css3多列（ie9及以上支持）column-count:3;//元素中文本分隔的列数column-gap:40px;//元素中文本列之间的间隔column-rule:3pxoutset#f00;//元素中文本列之间的宽度、样式和颜色css3用户界面//ie8及以上支持b牛大小：边框框；//元素宽度和高度包括padding和border//content-box不包括（默认）//border-box包括//即不支持resize:both;//调整元素大小，需要加上overflow:auto一起使用//水平可调宽度//垂直可调高度//宽度和高度都可调//none不可调//即不支持outline-offset:100px;//10pxat100pxoutlineelement//可以和outline一起使用:10pxsolidgreenps:第一次写文章，一个好的开始，加油...
