为了账号安全,请及时绑定邮箱和手机立即绑定
慕课网数字资源数据库体验端
十天精通CSS3_学习笔记_慕课网
为了账号安全,请及时绑定邮箱和手机立即绑定

十天精通CSS3

大漠 Web前端工程师
难度初级
时长 5小时 0分
  • 列间距column-gap column-gap主要用来设置列与列之间的间距,其语法规则如下: column-gap: normal || <length>
    查看全部
  • column-count属性主要用来给元素指定想要的列数和允许的最大列数。其语法规则: column-count:auto | <integer>
    查看全部
  • column-width的使用和CSS中的width属性一样,不过不同的是,column-width属性在定义元素列宽的时候,既可以单独使用,也可以和多列属性中其他属性配合使用。其基本语法如下所示 ; column-width: auto | <length>
    查看全部
  • column 能够在浏览器中设置多列布局,后面跟每栏的宽度和栏数。例:column: 150px 3;
    查看全部
  • animation-fill-mode:设置动画时间外属性。主要设置动画开始之前和结束之后发生的操作。主要有四个值:none,forwards,backwords,both. none:默认值,表示动画将按预期进行和结束,在动画完成其最后一帧时,会反转到初始帧处。 forwards:动画结束之后继续应用最后的关键帧位置。 backwards:会在元素应用动画样式时,迅速应用初始帧。 both:元素动画同时具有forwards和backwords的效果。
    查看全部
  • animation-play-state属性主要用来控制元素动画的播放状态 其主要有两个值:running和paused。
    查看全部
  • 设置动画播放方向 animation-direction属性主要用来设置动画播放方向,其语法规则如下: animation-direction:normal | alternate [, normal | alternate]* normal:默认设置 alternate:动画播放在第偶数次向前播放,第奇数次向反方向播放。
    查看全部
  • animation-iteration-count: infinite | <number> [, infinite | <number>]* 1、其值通常为整数,但也可以使用带有小数的数字,其默认值为1,这意味着动画将从开始到结束只播放一次。 2、如果取值为infinite,动画将会无限次的播放。
    查看全部
  • animation-delay属性用来定义动画开始播放的时间,用来触发动画播放的时间点。和transition-delay属性一样,用于定义在浏览器开始执行动画之前等待的时间。
    查看全部
  • animation-timing-function属性主要用来设置动画播放方式。主要让元素根据时间的推进来改变属性值的变换速率,简单点说就是动画的播放方式。
    查看全部
  • animation-duration 设置整个动画的时长
    查看全部
  • Keyframes被称为关键帧,其类似于Flash中的关键帧。在CSS3中其主要以“@keyframes”开头,后面紧跟着是动画名称加上一对花括号“{…}”,括号中就是一些不同时间段样式规则。
    查看全部
  • transition-delay属性和transition-duration属性极其类似,不同的是transition-duration是用来设置过渡动画的持续时间,而transition-delay主要用来指定一个动画开始执行的时间,也就是说当改变元素属性值后多长时间开始执行。 有时我们想改变两个或者多个css属性的transition效果时,只要把几个transition的声明串在一起,用逗号(“,”)隔开,然后各自可以有各自不同的延续时间和其时间的速率变换方式。但需要值得注意的一点:第一个时间的值为 transition-duration,第二个为transition-delay。
    查看全部
  • transition-timing-function 属性值 ease 由慢到快 linear 恒速 ease-in 渐显 ease-out 渐隐 ease-in-out 渐显渐隐
    查看全部
  • 动画--过渡所需时间 transition-duration transition-duration属性主要用来设置一个属性过渡到另一个属性所需的时间,也就是从旧属性过渡到新属性花费的时间长度,俗称持续时间。
    查看全部

举报

0/150
提交
取消
课程须知
1.html+CSS相关基础知识 2.具有一定的网页制作经验 3.此课程不支持IE9版本以下,建议使用 chrome、safari、firefox、opera浏览器学习本课程。
老师告诉你能学到什么?
1.系统学习CSS3相关知识 2.轻松制作出各种绚丽的效果
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!