慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

hi喵仔

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

查看全部

0 采集收起来源：CSS3中设置动画播放方向
2015-03-11
hi喵仔

设置动画播放次数 animation-iteration-count属性主要用来定义动画的播放次数。语法规则： animation-iteration-count: infinite | <number> [, infinite | <number>]* 1、其值通常为整数，但也可以使用带有小数的数字，其默认值为1，这意味着动画将从开始到结束只播放一次。 2、如果取值为infinite，动画将会无限次的播放。

查看全部

0 采集收起来源：CSS3中设置动画播放次数
2018-03-22
hi喵仔

设置动画开始播放的时间 animation-delay属性用来定义动画开始播放的时间，用来触发动画播放的时间点。和transition-delay属性一样，用于定义在浏览器开始执行动画之前等待的时间。语法规则： animation-delay:<time>[,<time>]*

查看全部

0 采集收起来源：CSS3中设置动画开始播放的时间
2018-03-22
hi喵仔

设置动画播放方式 animation-timing-function属性主要用来设置动画播放方式。主要让元素根据时间的推进来改变属性值的变换速率，简单点说就是动画的播放方式。语法规则： animation-timing-function:ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier(<number>, <number>, <number>, <number>) [, ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier(<number>, <number>, <number>, <number>)]* 它和transition中的transition-timing-function一样，具有以下几种变换方式：ease,ease-in,ease-in-out,ease-out,linear和cubic-bezier。对应功如下 ease 速度逐渐变慢，由快到慢 linear 恒速 ease-in 逐渐加速（渐显） ease-out 逐渐减速（渐隐） ease-in-out 逐渐加速-逐渐减速（渐显渐隐） [ 查看全文 ]

查看全部

0 采集收起来源：CSS3中设置动画播放方式
2018-03-22
hi喵仔

设置动画播放时间 animation-duration主要用来设置CSS3动画播放时间，其使用方法和transition-duration类似，是用来指定元素播放动画所持续的时间长，也就是完成从0%到100%一次动画所需时间。单位：S秒语法规则 animation-duration: <time>[,<time>]* 取值<time>为数值，单位为秒，其默认值为“0”，这意味着动画周期为“0”，也就是没有动画效果（如果值为负值会被视为“0”）。

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2018-03-22
hi喵仔

Keyframes介绍 Keyframes被称为关键帧，其类似于Flash中的关键帧。在CSS3中其主要以“@keyframes”开头，后面紧跟着是动画名称加上一对花括号“{…}”，括号中就是一些不同时间段样式规则。 @keyframes changecolor{ 0%{ background: red; } 100%{ background: green; } } 在一个“@keyframes”中的样式规则可以由多个百分比构成的，如在“0%”到“100%”之间创建更多个百分比，分别给每个百分比中给需要有动画效果的元素加上不同的样式，从而达到一种在不断变化的效果。经验与技巧：在@keyframes中定义动画名称时，其中0%和100%还可以使用关键词from和to来代表，其中0%对应的是from，100%对应的是to。浏览器的支持情况： Chrome 和 Safari 需要前缀 -webkit-；Foxfire 需要前缀 -moz-。

查看全部

0 采集收起来源：CSS3 Keyframes介绍
2015-03-11
势仔仔

ease 速度逐渐变慢，由快到慢 linear 恒速 ease-in 逐渐加速（渐显） ease-out 逐渐减速（渐隐） ease-in-out 逐渐加速-逐渐减速（渐显渐隐）

查看全部

0 采集收起来源：CSS3中设置动画播放方式
2015-03-11
qxw5267

1、阴影模糊半径与阴影扩展半径的区别阴影模糊半径：此参数可选，其值只能是为正值，如果其值为0时，表示阴影不具有模糊效果，其值越大阴影的边缘就越模糊；阴影扩展半径：此参数可选，其值可以是正负值，如果值为正，则整个阴影都延展扩大，反之值为负值时，则缩小；

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（二）
2015-03-11
qxw5267

box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式]; 注意：inset 可以写在参数的第一个或最后一个，其它位置是无效的。

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2015-03-15
qxw5267

阴影扩展半径:相当增加阴影的长度偏移量：只是对元素的投影

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2015-03-11
势仔仔

-webkit-animation-name:around; -webkit-animation-duration: 10s; -webkit-animation-timing-function: ease; -webkit-animation-delay: 1s; -webkit-animation-iteration-count:infinite; 记住这几个属性和属性值

查看全部

0 采集收起来源：CSS3中调用动画
2015-03-11
睡觉的眼镜

border-image:url(borderimg.png) 70 stretch 中间的数字越大，图片间距变密集

查看全部

0 采集收起来源：CSS3边框为边框应用图片 border-image
2015-03-11
我是好人菌

CSS3的圆角效果： border-radius:左上右上右下左下(顺时针)px;

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2015-03-15
我是好人菌

-webkit chrome和safari -moz firefox -ms IE -o opera

查看全部

0 采集收起来源：什么是CSS3？
2015-03-11
一路向南_0004

text-shadow可以用来设置文本的阴影效果。语法： text-shadow: X-Offset Y-Offset blur color; X-Offset：表示阴影的水平偏移距离,正值向（右）／复值向（左） Y-Offset：是指阴影的垂直偏移距离,正值向（下）／复值向（上） Blur：是指阴影的模糊程度。（无）负值，值数越大越模糊。不需要模糊（0）

查看全部

0 采集收起来源：CSS3文字与字体文本阴影text-shadow
2015-03-11

首页上一页 1070 1071 1072 1073 1074 1075 1076 下一页尾页

0/150

提交

取消

开始学习

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

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