慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

门掩重关萧寺中

它主要应用在文本的多列布局方面 columns：<column-width> || <column-count> columns: 200px 2;

查看全部

0 采集收起来源：CSS3 多列布局——Columns
2018-03-22
门掩重关萧寺中

animation-fill-mode属性定义在动画开始之前和结束之后发生的操作。主要具有四个属性值：none、forwards、backwords和both。 =============== none默认值，表示动画完成其最后一帧时，动画会反转到初始帧处 forwards表示动画在结束后继续应用最后的关键帧的位置 backwards会在向元素应用动画样式时迅速应用动画的初始帧 both元素动画同时具有forwards和backwards效果，即停留在最后一帧，刷新后立即使用初始帧 ===================== animation-fill-mode:forwards;

查看全部

0 采集收起来源：CSS3中设置动画时间外属性
2017-02-02
门掩重关萧寺中

animation-play-state属性主要用来控制元素动画的播放状态。 ================= animation-play-state:paused; 其主要有两个值：running和paused。

查看全部

0 采集收起来源：CSS3中设置动画的播放状态
2017-02-02
门掩重关萧寺中

animation-direction属性主要用来设置动画播放方向 1、normal是默认值，如果设置为normal时，动画的每次循环都是向前播放； 2、另一个值是alternate，他的作用是，动画播放在第偶数次向前播放，第奇数次向反方向播放。 ====================== animation-direction:alternate;

查看全部

0 采集收起来源：CSS3中设置动画播放方向
2017-02-02
门掩重关萧寺中

animation-iteration-count属性主要用来定义动画的播放次数。 animation-iteration-count:5; ================ 1、其值通常为整数，但也可以使用带有小数的数字，其默认值为1，这意味着动画将从开始到结束只播放一次。 2、如果取值为infinite，动画将会无限次的播放。

查看全部

2 采集收起来源：CSS3中设置动画播放次数
2017-02-02
门掩重关萧寺中

animation-delay属性用来定义动画开始播放的时间，用来触发动画播放的时间点。 ===================== animation-delay:2s;

查看全部

0 采集收起来源：CSS3中设置动画开始播放的时间
2017-02-02
门掩重关萧寺中

animation-timing-function属性主要用来设置动画播放方式。 animation-timing-function:ease;

查看全部

0 采集收起来源：CSS3中设置动画播放方式
2017-02-02
门掩重关萧寺中

animation-duration主要用来设置CSS3动画播放时间 ============== animation-duration: <time>[,<time>]* ================ @keyframes toradius{ from { border-radius: 0; } to { border-radius: 100%; }

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2018-03-22
门掩重关萧寺中

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

查看全部

0 采集收起来源：CSS3中调用动画
2017-02-02
慕九州7228675

1. CSS2中，元素(例如div)的内边距(padding)和边框(border)会把元素自身撑大。想要个100*100px的div，都要事先计算，例如，内容80px + 内边距15px + 边框5px = 100px 2. CSS3中，新增 box-sizing 属性，如果设置元素为 box-sizing: border-box，那么元素的内边距(padding)和边框(border)不会再把元素自身撑大。例如，设置div为100*100px，那么无论div里内容、内边距、边框的宽高怎么变化，div的大小永远都是100*100px

查看全部

0 采集收起来源：CSS3 盒子模型
2017-02-02
门掩重关萧寺中

Keyframes被称为关键帧，其类似于Flash中的关键帧。在CSS3中其主要以“@keyframes”开头，后面紧跟着是动画名称加上一对花括号“{…}”，括号中就是一些不同时间段样式规则。 ==================== @keyframes wobble { 0% { margin-left: 100px; background:green; } 40% { margin-left:150px; background:orange; } 60% { margin-left: 75px; background: blue; } 100% { margin-left: 100px; background: red; } } div { width: 100px; height: 100px; background:red; color: #fff; }

查看全部

0 采集收起来源：CSS3 Keyframes介绍
2017-02-02
慕九州7228675

总结下，CSS3中的三种动画:tranform形变动画/transition缓动动画/animation逐帧动画; tranform: rotate旋转/skew扭曲/scale缩放/translate移动/matrix矩阵变形; transition: property duration timing-function delay; animation: KeyframesName duration timing-function delay iteration-count direction play-state fill-mode;

查看全部

0 采集收起来源：CSS3中设置动画播放时间
2017-02-01
慕九州7228675

ease 规定慢速开始，然后变快，然后慢速结束的过渡效果（cubic-bezier(0.25,0.1,0.25,1)）。 ease-in 规定以慢速开始的过渡效果（等于 cubic-bezier(0.42,0,1,1)）。 ease-out 规定以慢速结束的过渡效果（等于 cubic-bezier(0,0,0.58,1)）。 ease-in-out 规定以慢速开始和结束的过渡效果（等于 cubic-bezier(0.42,0,0.58,1)）。

查看全部

0 采集收起来源：CSS3中的动画--过渡属性 transition-property
2017-02-01
雨安

CSS3选择器 :read-write选择器 “:read-write”选择器刚好与“:read-only”选择器相反，主要用来指定当元素处于非只读状态时的样式。

查看全部

0 采集收起来源：CSS3选择器 :read-write选择器
2017-02-01
雨安

“:read-only”伪类选择器用来指定处于只读状态元素的样式。简单点理解就是，元素中设置了“readonly=’readonly’”

查看全部

0 采集收起来源：CSS3选择器 :read-only选择器
2017-02-01

首页上一页 323 324 325 326 327 328 329 下一页尾页

0/150

提交

取消

开始学习

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

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