慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

天羽蔚灵

background-origin 设置元素背景图片的原始起始位置。语法： background-origin ： border-box | padding-box | content-box; 参数分别表示背景图片是从边框，还是内边距（默认值），或者是内容区域开始显示。

查看全部

0 采集收起来源：CSS3背景 background-origin
2015-10-05
sweetlife哦耶

对代码做一些调整后，有利于观察：将初始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。

查看全部

7 采集收起来源：CSS3中设置动画时间外属性
2018-03-22
天羽蔚灵

@font-face { font-family : 字体名称; src : 字体文件在服务器上的相对或绝对路径; }

查看全部

0 采集收起来源：CSS3文字与字体嵌入字体@font-face
2015-10-05
天羽蔚灵

text-overflow:clip(剪切) || ellipsis(显示省略号标记) word-wrap:normal(表示控制连续文本换行) | break-word（表示内容将在边界内换行）

查看全部

0 采集收起来源：CSS3文字与字体 text-overflow 与 word-wrap
2015-10-05
天羽蔚灵

渐变背景：径向渐变：linear-gradient(to 角度,颜色，颜色)

查看全部

0 采集收起来源：CSS3颜色渐变色彩
2015-10-05
天羽蔚灵

box-shadow: X轴偏移量 Y轴偏移量 [阴影模糊半径] [阴影扩展半径] [阴影颜色] [投影方式];

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2015-10-05
angie2020

其主要有两个值：normal、alternate 1、normal是默认值，如果设置为normal时，动画的每次循环都是向前播放； 2、另一个值是alternate，他的作用是，动画播放在第偶数次向前播放，第奇数次向反方向播放。例如：通过animation-direction属性，将move动画播放动画方向设置为alternate，代码为：

查看全部

0 采集收起来源：CSS3中设置动画播放方向
2015-10-05
angie2020

经验与技巧：在@keyframes中定义动画名称时，其中0%和100%还可以使用关键词from和to来代表，其中0%对应的是from，100%对应的是to。

查看全部

0 采集收起来源：CSS3 Keyframes介绍
2015-10-05
兵灯

box-shadow是向盒子添加阴影 box-shadow: X轴偏移量 Y轴偏移量【阴影模糊半径】【阴影扩展半径】【阴影颜色】【投影方式】;

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2015-10-05
兵灯

border-radius:10px/*所有角使用半径10px的圆角*/

查看全部

0 采集收起来源：CSS3边框圆角效果 border-radius
2015-10-05
Arvin丶Tsang

transform: translate(-50%, -50%);//平移其中，50%相对的是元素的宽度和高度的百分之五十，因此，用translate可以实现一个块状元素的水平垂直居中，而无需知道这个块状元素的宽度和高度。如下： top:50%; left:50%; transform: translate(-50%, -50%);

查看全部

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

wekit－－是兼容谷歌，主要是兼容safari moz－－是兼容火狐的

查看全部

0 采集收起来源：CSS3中的变形--扭曲 skew()
2015-10-04
angie2020

如果这个值为正值，元素相对原点中心顺时针旋转；如果这个值为负值，元素相对原点中心逆时针旋转。如下图所示

查看全部

0 采集收起来源：CSS3变形--旋转 rotate()
2015-10-04
angie2020

::before和::after这两个主要用来给元素的前面或后面插入内容，这两个常和"content"配合使用，使用的场景最多的就是清除浮动

查看全部

0 采集收起来源：CSS3选择器 ::before和::after
2018-03-22
angie2020

而且可以是整数值(1,2,3,4)，也可以是表达式(2n+1、-n+5)和关键词(odd、even)，但参数n的起始值始终是1，而不是0。也就是说，参数n的值为0时，选择器将选择不到任何匹配的元素?

查看全部

0 采集收起来源：CSS3 结构性伪类选择器—nth-child(n)
2015-10-04

首页上一页 748 749 750 751 752 753 754 下一页尾页

0/150

提交

取消

开始学习

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

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