今天偶尔看到了一篇文章讲z-index的, 有一些新的收获吧, 记录一下. 他给了一个例子: 显示结果: 现在要求把红色的放在最下面,但是不能改变html的顺序,也不能改变zindex和position. 解决方案放在最后. 决定元素在界面上显示前后顺序(z轴方向)的有: 但是在设置的时候还需要根据 ...
分类：
Web程序 时间：
2019-12-23 18:39:04
阅读次数：
100
css线性背景 background:linear gradient(20deg, ccffff, ffcccc); transform transform:scale(1.5); transform:skewX(10deg); transform:rotate(10deg); animation ...
分类：
Web程序 时间：
2019-12-23 16:57:34
阅读次数：
157
原图： 1）filter: grayscale(100%) // 灰度100% 2）filter: blur(5px) // 模糊5px 3）filter: brightness(300%) // 3倍亮度 4）filter: contrast(200%) // 200%对比度 5）filter: ...
分类：
Web程序 时间：
2019-12-23 14:53:14
阅读次数：
145
案例：旋转木马 页面加载时候出现的效果，script标签写在head里面，body上面 显示一个图片散开的动画，遍历之后，把每个图片用封装的动画函数移动到指定目标（同时改变多属性：宽，透明度，层级，top, left） 在做左右按钮点击事件。 右边按钮，用数组里面的push和shift，数组第一个去 ...
分类：
Web程序 时间：
2019-12-23 13:11:33
阅读次数：
83
Vue的动画原理： 在动画执行的不同的时刻添加不同 class 在动画还没有开始的时候 opacity 为0，但是当第一帧开始显示的时候 fade-enter css类去除 opacity就变成了1，而transition就是监听opacity 的变化 3s 表示 在3s内改变完成 离开动画也是类似 ...
分类：
其他好文 时间：
2019-12-21 00:31:48
阅读次数：
170
原文:WPF 精修篇 倾斜 SkewTransform 倾斜 SkewTransform AngleX 倾斜X角度 AngleY 倾斜Y角度 CenterX CenterY 中心点 ... ...
图上那些类似于星座图的点和线 是由vue-particles生成的，不仅自己动，而且能与用户鼠标事件产生互动。 是非常炫的一种动态特效 可以在Vue项目中使用，需要安装第三方依赖 使用步骤 1. 安装 npm install vue-particles --save-dev 复制代码 或者 npm ...
分类：
其他好文 时间：
2019-12-20 18:34:56
阅读次数：
118
// 简单记录一下，下次就知道vue动画都怎么做了。<transition name="fade"> <router-view ></router-view> </transition> .fade-enter { opacity:0; } .fade-leave{ opacity:1; } .fa ...
分类：
其他好文 时间：
2019-12-19 19:17:03
阅读次数：
92
checkbox: html: <div> <label class="unSelected selected" for="choose"> <checkbox clsss="choose"/> </label> </div> css: .unSelected{ display: inline-bl ...
分类：
其他好文 时间：
2019-12-16 13:29:55
阅读次数：
283
// 1. css样式 div { width: 100px; height: 100px; background: olivedrab; position: absolute; left: 0px; opacity: 1; } .top { top: 100px; } .bottom { top: ...
分类：
Web程序 时间：
2019-12-15 14:25:34
阅读次数：
122
