慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

小幸福简简单单

border-radius 圆边效果

查看全部

0 采集收起来源：CSS3能做什么？
2016-05-16
小幸福简简单单

-webkit 谷歌和苹果浏览器 -moz 火狐浏览器 -ms IE -o 欧朋浏览器

查看全部

0 采集收起来源：什么是CSS3？
2016-05-16
涂山小狐狸3339196

对代码做一些调整后，有利于观察：将初始background设置为orange，姑且把这一帧叫做初始帧动画里面的red为第一帧，blue为最后一帧。将duration调短为5s，将delay调长为3s。下面就可以开始试了： 1. none：从初始帧orange开始，延迟3s后开始播放动画 red-->blue，动画完成后，跳回到初始帧orange。 2. forwards：从初始帧orange开始，延迟3s后开始播放动画 red-->blue，动画完成后，留在最后一帧blue. 3. backwards : 也是从初始帧orange开始，但是由于会迅速应用动画的第一帧，立马就闪到了第一帧red。并非延迟不管用了，而是在应用第一帧之后，才延迟。动画完成后，跳回到初始帧orange。 4. both：同时具有forwards和backwards效果，即拥有forwards动画结束留在最后一帧blue的效果，也拥有迅速应用动画的第一帧red的效果。这样both综合的效果为：从初始帧orange开始，迅速跳到第一帧red，然后变化到最后一帧blue结束，并留在最后一帧blue。

查看全部

0 采集收起来源：CSS3中设置动画时间外属性
2018-03-22
涂山小狐狸3339196

其实就是第一次正常，第二次反过来

查看全部

0 采集收起来源：CSS3中设置动画播放方向
2016-05-16
涂山小狐狸3339196

animation-direction属性主要用来设置动画播放方向，其语法规则如下： animation-direction:normal | alternate [, normal | alternate]* 其主要有两个值：normal、alternate 1、normal是默认值，如果设置为normal时，动画的每次循环都是向前播放； 2、另一个值是alternate，他的作用是，动画播放在第偶数次向前播放，第奇数次向反方向播放。

查看全部

0 采集收起来源：CSS3中设置动画播放方向
2016-05-16
hello_zore

position 位置的50%是body的50%，而translate的50%是自身宽高的50%，+/-号代表方向

查看全部

0 采集收起来源：CSS3中的变形--位移 translate()
2016-05-16
涂山小狐狸3339196

animation-iteration-count:infinite; 无穷次

查看全部

0 采集收起来源：CSS3中设置动画播放方式
2016-05-16
青灯过往

只有 Chrome 和 Opera 支持 column-span 属性。火狐不支持

查看全部

1 采集收起来源：CSS3 跨列设置column-span
2016-05-16
青灯过往

效果很炫酷,但不是很明白

查看全部

0 采集收起来源：制作3D旋转导航综合练习题
2016-05-18
涂山小狐狸3339196

提示：到目前为止支技animation动画的只有webkit内核的浏览器，所以我需要在上面的基础上加上-webkit前缀，据说Firefox5可以支持css3的 animation动画属性。

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2016-05-16
涂山小狐狸3339196

animation-duration: <time>[,<time>]* 取值<time>为数值，单位为秒，其默认值为“0”，这意味着动画周期为“0”，也就是没有动画效果（如果值为负值会被视为“0”）

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2018-03-22
涂山小狐狸3339196

animation-name属性主要是用来调用 @keyframes 定义好的动画。需要特别注意: animation-name 调用的动画名需要和“@keyframes”定义的动画名称完全一致（区分大小写），如果不一致将不具有任何动画效果。语法： animation-name: none | IDENT[,none|DENT]*; 1、IDENT是由 @keyframes 创建的动画名，上面已经讲过了（animation-name 调用的动画名需要和“@keyframes”定义的动画名称完全一致）； 2、none为默认值，当值为 none 时，将没有任何动画效果,这可以用于覆盖任何动画。注意：需要在 Chrome 和 Safari 上面的基础上加上-webkit-前缀，Firefox加上-moz-。

查看全部

0 采集收起来源：CSS3中调用动画
2016-05-16
涂山小狐狸3339196

注意：有单位s啊

查看全部

0 采集收起来源：CSS3中的动画--过渡延迟时间 transition-delay
2016-05-16
hello_zore

:root{}根选择器，相当于html{}，推荐使用:root{};

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—root
2016-05-16
涂山小狐狸3339196

1.ease：Default value. Specifies a transition effect with a slow start, then fast, then end slowly (即cubic-bezier(0.25,0.1,0.25,1)) 2.linear：Specifies a transition effect with the same speed from start to end即cubic-bezier(0,0,1,1) 3.ease-in：Specifies a transition effect with a slow start即cubic-bezier(0.42,0,1,1) 4.ease-ou：Specifies a transition effect with a slow end即cubic-bezier(0,0,0.58,1)) 5.ease-in-out：Specifies a transition effect with a slow start and end即cubic-bezier(0.42,0,0.58,1)) 6.step-start：即steps(1, start) 7.step-end：即steps(1, end) 8.steps(int,start|end)：The first parameter specifies the number of intervals in the function. It must be a positive integer (大于0). 第二个可选, is either the value "start" or "end", and specifies the point at which the change of values occur within the interval. If the second parameter is omitted, it is given the value "end" 9.cubic-bezier(n,n,n,n)：Define your own values from 0 to 1 10.initial：默认 11.inherit：继承父元素

查看全部

0 采集收起来源：CSS3中的动画--过渡函数 transition-timing-function
2018-03-22

首页上一页 526 527 528 529 530 531 532 下一页尾页

0/150

提交

取消

开始学习

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

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