慕课网

精品课程十天精通CSS3

十天精通CSS3

最热最新

古__月

说明: 我们可以使用transiition-timing-function的几个不同的参数来实现效果,同时我们也可以直接通过一种方法就实现效果:如 transition: all .5s ease-in .2s; 这就是一行的写法

查看全部

0 采集收起来源：CSS3中的动画--过渡延迟时间 transition-delay
2016-01-14
古__月

transition-timing-function是动画的过渡函数: 有下面几种: ease linear ease-in ease-out ease-in-out 上面的几种方法是可以用来实现动画的快慢

查看全部

0 采集收起来源：CSS3中的动画--过渡函数 transition-timing-function
2016-01-14
古__月

我们在使用transition-property属性的时候: 可以同时结合其他的各种方法来实现特效的结合, 如:使用div:hover{}这种属性

查看全部

0 采集收起来源：CSS3中的动画--过渡所需时间 transition-duration
2016-01-14
古__月

动画: transition-property的使用方法如: div{ transition-property:width;//表示使对width实现动画效果 transition-duration:0.5s;//表示动画的时间 transition-timing-fuction:ease-in;//这里的ease-in是过渡函数 transition-delay:1s;//表示开始出现的延迟时间 }

查看全部

0 采集收起来源：CSS3中的动画--过渡属性 transition-property
2016-01-14
古__月

我们知道在实现一些旋转的时候,元素的旋转是在中心点实现的,但是有的时候我们希望那个中心点可以由我们自己来设定,这个时候我们就可以使用到transforn-origin: 具体的使用方法是在对应元素的css中进行设置,如: .test{ transform-origin:left top; } 这个属性的取值有 top right bottom left center 等

查看全部

0 采集收起来源：CSS3中的变形--原点 transform-origin
2016-01-14
夕月

css3多列布局 columns：<column-width> || <column-count>

查看全部

0 采集收起来源：CSS3 多列布局——Columns
2018-03-22
SuperManSuperWorld

设置盒子阴影:box-shadow box-shadow box-shadow box-shabow box-shadow box-shadow box-shadow box-shadow box-shadow box-shabox box-shabox box-shabox box-shabox box-shadow box-shadow box-shadow box-shabox box-shabox box-shabox box-shabox

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（二）
2016-01-14
SuperManSuperWorld

盒子设置阴影:box-shadow:5px 5px 10px red右边阴影,-5px -5px 10px blue左上角阴影,-5px 0px 10px 5px green inset内部阴影

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2016-01-14
SuperManSuperWorld

设置半圆:border-radius border-radius

查看全部

0 采集收起来源：CSS3边框阴影 box-shadow（一）
2016-01-14
古__月

translate()函数: 使用的方法很简单: 1. translate(x,y)表示水平方向和垂直方向同时移动 2. translate(x)仅水平方向移动 3.translate(y)仅垂直方向移动注意:translate()函数可以将元素向指定的方向移动,类似于position中的relative,可以把元素冲原来的位置移开,而不会影响其他组件,也就是没有脱离文档流

查看全部

0 采集收起来源：CSS3中的变形--位移 translate()
2016-01-14
古__月

scale()函数的使用: 1.scale(X,Y)表示使元素水平方向和垂直方向同时缩放 2.scale(X)表示仅水平方向缩放 3.scale(Y)表示仅垂直方向缩放注意:Y是一个可选参数,如果没有设置Y值,则表示X,Y两个方向缩放倍数是一样的

查看全部

0 采集收起来源：CSS3中的变形--缩放 scale()
2016-01-14
古__月

transform:scale(0.8); -ms-transform:scale(0.8); /* IE 9 */ -moz-transform:scale(0.8); /* Firefox */ -webkit-transform:scale(0.8); /* Safari 和 Chrome */ -o-transform:scale(0.8); /* Opera */ 以上的代码是实现了浏览器的兼容问题

查看全部

0 采集收起来源：CSS3中的变形--缩放 scale()
2016-01-14
古__月

扭曲:skew(Xdeg,Ydeg); 能够让元素倾斜显示,与rotate()函数的旋转不同,rotate()函数只是选择,不会改变元素的形状,skew()函数不会旋转,只会改变元素的形状其中X表示的是水平方法旋转,Y表示垂直方向旋转角度,默认值是0

查看全部

0 采集收起来源：CSS3中的变形--扭曲 skew()
2016-01-14
古__月

旋转:rotate()函数主要在二维空间内进行操作,设置一个角度值,用来指定旋转的幅度,如果这个值是正值,那么元素相对原点顺时针旋转,如果是负值就相对原定逆时针旋转使用方法: transform:rotate(20deg); 注意,上面是写在对应的css的样式中的,其中的20deg表示的是旋转的角度,其中deg表示的是角度的单位

查看全部

0 采集收起来源：CSS3变形--旋转 rotate()
2016-01-14
古__月

:read-write选择器: 刚好与":read-only"选择器相反,主要用来指定当元素处于非只读状态时, 我们可以来设置元素的样式

查看全部

0 采集收起来源：CSS3选择器 :read-write选择器
2018-03-22

首页上一页 657 658 659 660 661 662 663 下一页尾页

0/150

提交

取消

开始学习

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

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