慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

aashine

animation-delay：动画延时

查看全部

0 采集收起来源：CSS3中设置动画开始播放的时间
2015-05-15
aashine

animation-timing-function属性设置动画播放方式，其功能与transition中的transition-timing-function一样。参数：http://img1.sycdn.imooc.com//534b8bb100016e9f05690795.jpg

查看全部

0 采集收起来源：CSS3中设置动画播放方式
2015-05-15
aashine

animation-duration：控制元素播放动画所持续的时间长，也就是完成从0%到100%一次动画所需时间。例：

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2015-05-15
aashine

animation-name属性主要是用来调用 @keyframes 定义好的动画。注意: animation-name 调用的动画名需要和“@keyframes”定义的动画名称完全一致（区分大小写）。浏览器兼容：Chrome和Safari上面的基础上加上-webkit-前缀，Firefox加上-moz-。例：

查看全部

0 采集收起来源：CSS3中调用动画
2015-05-15
aashine

@keyframes：为动画效果添加关键帧（关键帧可以有多个）扩展：在@keyframes中定义动画名称时，其中0%和100%还可以使用关键词from和to来代表，其中0%对应的是from，100%对应的是to。浏览器兼容：http://img1.sycdn.imooc.com//534fa4450001513c05120121.jpg 例：

查看全部

0 采集收起来源：CSS3 Keyframes介绍
2015-05-15
aashine

扩展：改变两个或者多个css属性的transition效果时，只要把几个transition的声明串在一起，用逗号（“，”）隔开，然后各自可以有各自不同的延续时间和其时间的速率变换方式。但需要值得注意的一点：第一个时间的值为 transition-duration，第二个为transition-delay。例（与扩展内容无关）：

查看全部

0 采集收起来源：CSS3中的动画--过渡延迟时间 transition-delay
2015-05-15
aashine

transition-property:过渡动画属性创建过度动画效果步骤：第一，在默认样式中声明元素的初始状态样式；第二，声明过渡元素最终状态样式，比如悬浮状态；第三，在默认样式中通过添加过渡函数，添加一些不同的样式。细化到每个函数： 1.transition-property:指定过渡或动态模拟的CSS属性,其可选参数：http://img1.sycdn.imooc.com//5344eca300010a8005510421.jpg 2.transition-duration:指定完成过渡所需的时间 3.transition-timing-function:指定过渡函数:http://www.imooc.com/code/1012 4.transition-delay:指定开始出现的延迟时间例：

查看全部

0 采集收起来源：CSS3中的动画--过渡属性 transition-property
2015-05-15
aashine

transform-origin，重置元素变形（旋转、位移、缩放，扭曲）的原点位置参数：http://img1.sycdn.imooc.com//53391ea500013e4706860384.jpg 例：

查看全部

0 采集收起来源：CSS3中的变形--原点 transform-origin
2015-05-15
aashine

matrix(a,b,c,d,e,f)矩阵2D变换函数参数：第一个宽度比例1就是原大小，第二个是上下倾斜1就是2倍，2就是3倍，第三个是左右倾斜，数字和第二个一样的意思，第四个是高度比例1就是原大小，第五个是X方向的像素位移，X方向就是左右，第六个是Y方向的像素位移，X方向就是上下

查看全部

0 采集收起来源：CSS3中的变形--矩阵 matrix()
2015-05-15
aashine

translate()移位函数 1、translate(x,y)水平方向和垂直方向同时移动（也就是X轴和Y轴同时移动） 2、translateX(x)仅水平方向移动（X轴移动） 3、translateY(Y)仅垂直方向移动（Y轴移动）例：通过移位函数，实现元数水平和垂直居中

查看全部

0 采集收起来源：CSS3中的变形--位移 translate()
2015-05-15
aashine

scale()缩放变形函数：让元素根据中心原点对对象进行缩放 1、 scale(X,Y)使元素水平方向和垂直方向同时缩放（也就是X轴和Y轴同时缩放 2、scaleX(x)元素仅水平方向缩放（X轴缩放） 3、scaleY(y)元素仅垂直方向缩放（Y轴缩放）例：

查看全部

0 采集收起来源：CSS3中的变形--缩放 scale()
2015-05-15
aashine

skew()扭曲变形函数 1、skew(x,y)使元素在水平和垂直方向同时扭曲（X轴和Y轴同时按一定的角度值进行扭曲变形）； 2、skewX(x)仅使元素在水平方向扭曲变形（X轴扭曲变形） 3、skewY(y)仅使元素在垂直方向扭曲变形（Y轴扭曲变形）例：

查看全部

0 采集收起来源：CSS3中的变形--扭曲 skew()
2015-05-15
aashine

rotate()旋转函数，指定角度参数使元素相对原点进行旋转。正值：顺时针旋转；负值：逆时针旋转。例:

查看全部

0 采集收起来源：CSS3变形--旋转 rotate()
2015-05-15
aashine

:transform：对元数进行旋转或平移操作，http://www.w3school.com.cn/cssref/pr_transform.asp 切换背景图案例

查看全部

0 采集收起来源：切换背景图像综合练习题
2015-05-15
我本平凡

相当于给id选择器添加了一个鼠标点击事件

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—target
2015-05-14

首页上一页 950 951 952 953 954 955 956 下一页尾页

0/150

提交

取消

开始学习

课程须知: 1.html+CSS相关基础知识 2.具有一定的网页制作经验 3.此课程不支持IE9版本以下，建议使用 chrome、safari、firefox、opera浏览器学习本课程。

老师告诉你能学到什么？: 1.系统学习CSS3相关知识 2.轻松制作出各种绚丽的效果