-
设置参数为负数：
scale()函数让元素根据中心原点对对象进行缩放，相当于向量的放缩，当scale(x,y)中x,y为负数时，该元素方向就改变了。或者理解为直角坐标系，x,y为负数相当于每个点的坐标加一个符号。
查看全部 -
opacity 是设置透明度，它的值在0~1之间， .5就是0.5，这里省略了0，也就是半透明的意思；
-webkit-代表在谷歌或者苹果浏览器下的前缀，-moz-代表火狐浏览器的前缀；
设置负数被的时候？？
查看全部 -
可以作用于内联元素，注意如果xy的扭曲都是45度（或者一个45，一个-45），那么图片会消失，相当于将一个平行四边形，捏着两个角一直拉成了一条线。
如果要保持框内的文字保持不变，可以另外设置一个span，然后反方向扭转
查看全部 -
旋转rotate()函数通过指定的角度参数使元素相对原点进行旋转。它主要在二维空间内进行操作，设置一个角度值，用来指定旋转的幅度。如果这个值为正值，元素相对原点中心顺时针旋转；如果这个值为负值，元素相对原点中心逆时针旋转
作用于块级元素
transform: rotate(45deg);
查看全部 -
transition-delay主要用来指定一个动画开始执行的时间，也就是说当改变元素属性值后多长时间开始执行 两个或者多个css属性的transition效果时，只要把几个transition的声明串在一起，用逗号（“，”）隔开 例如：a{ transition: background 0.8s ease-in 0.3,color 0.6s ease-out 0.3;} 需要值得注意的一点：第一个时间的值为 transition-duration，第二个为transition-delay。查看全部 -
matrix(1,0,0,1,50,50)
6个属性的意思的：第一个宽度比例1就是原大小，第二个是上下倾斜1就是2倍，2就是3倍，第三个是左右倾斜，数字和第二个一样的意思，第四个是高度比例1就是原大小，第五个是X方向的像素位移，X方向就是左右，第六个是Y方向的像素位移，X方向就是上下
查看全部 -
MARK!
查看全部 -
only-child:值得是父容器只有一个子元素
only-of-type指的是父容器可以有多个不同的子元素，但目标子元素只能有一个
查看全部 -
不管是nth-child(n),nth-last-child(n)
还是nth-of-type(n),nth-last-of-type(n)
只要括号后面是表达式，那结果都一样
查看全部 -
只有元素获取到焦点或者被激活时呈现
查看全部 -
如果通过background一次性设置属性时，size要放在position后面并在size前面加/
查看全部 -
transition是过度状态，可以理解为低配版的keyframes
keyframes是动画
过渡状态只有两种，初始跟默认
动画可以有多种，通过百分比定义动画执行过程中的状态，其中0代表from 100%代表to
查看全部 -
transition-property:all 表示让所有状态都实现过度效果
若transition-property:width,则只有宽度为过渡效果
查看全部 -
根据 x y轴，正数往右下 负数往左上
查看全部 -
切换背景图像综合练习题 同学们，根据所学知识，使用CSS3知识，实现背景图片的切换效果（不依赖js，点击小图切换大的背景图）  任务 给每个列表定义不同的背景颜色  提示：使用结构伪类选择器:nth-of-type() 设置缩略图外形效果 提示：使用伪元素::after制作圆形效果  1、给每个缩略图设置不同的图片 提示：使用伪结构选择器:nth-of-type()，并且配合::after 2、给每个缩略图添加透明度蒙板效果 提示：使用伪类选择器::before给缩略图添加蒙板效果 3、鼠标悬浮在缩略图上时，修改缩略图上蒙板的透明度 提示：通过:hover和::before配合修改opacity的值为0 4、点击缩略图，切换背景图片 提示：通过目标选择器:target进行背景图片的切换 5、控制不是被点击图片的层级大小，让其不显示 提示：通过“否定选择器:not()”和“目标选择器:target”来控制不是被切换的背景图像不显示 index.html <!DOCTYPE HTML> <htmllang="en-US"> <head> <meta charset="UTF-8"> <title>CSS3 Full Background Slider </title> <style type="text/css"> @importurl("http://www.w3cplus.com/demo/css3/base.css"); @importurl("http://fonts.googleapis.com/css?family=Yesteryear"); html,body { height: 100%; } /*设置背景图片全屏显示，并且居中*/ img.bg { min-height: 100%; min-width: 1024px; width: 100%; height: auto !important; height: 100%; position: fixed; top: 0; left: 50%; z-index:1; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%);查看全部
举报