我们在开发的过程中经常会遇到背景色是渐变的背景色，一般可以制作背景图，如果仅仅是简单的线性变换的背景，今天我就遇到了，其实完全可以用CSS3的渐变来实现这个效果。这个过程由浏览器来生成，不用去加载静态的资源，提高性能。 渐变有两种： 线性渐变（Linear Gradients）- 向下/向上/向左/ ...
分类：
Web程序 时间：
2020-07-24 15:26:11
阅读次数：
90
CSS3 渐变 渐变就是在两个或者多个指定颜色之间平稳过度 线性渐变linear-gradient 沿着一根轴线改变颜色 linear-gradient属性设置线性渐变 语法background :linear-gradient(angle,color-stop1,color-stop2....)默 ...
分类：
Web程序 时间：
2020-06-29 15:43:55
阅读次数：
57
因为我不喜欢背公式，希望自己能找到比较容易理解和推理的记忆方式吧，很早就感觉CSS3渐变的属性组成不太好记忆，所以今天终于挖了这个坑，其实也没什么很特别的，嘻嘻，如果有错误欢迎提出。 基本用法 我们一般都是在添加background的时候会用到这个渐变效果，渐变效果分为linear-gradient ...
分类：
Web程序 时间：
2020-06-03 21:59:24
阅读次数：
77
css3的渐变属性已经在各种网页设计中被广泛使用，在没有css3的渐变属性之前，要实现一些多种颜色切换的效果图，你可能别无他法，只能用一个图片来显示，虽然你知道使用图片需要网络请求，既耗带宽又耗时间，下面我将介绍用css3的渐变来改善这一问题。 linear-gradient 基本用法 想要知道线性 ...
分类：
Web程序 时间：
2020-05-30 20:18:00
阅读次数：
69
效果预览： 下载地址：https://qrk.lanzous.com/ic91f6d 建议复制后打开 点击下载 ...
分类：
Web程序 时间：
2020-05-04 17:34:45
阅读次数：
165
尽量使用css3动画，开启硬件加速 适当使用touch时间代替click时间 避免使用css3渐变阴影效果 可以用transform: translateZ(0) 来开启硬件加速 不滥用float。float在渲染时计算量比较大，尽量减少使用 不滥用web字体。web字体需要下载，解析，重绘当前页面 ...
分类：
移动开发 时间：
2020-04-06 17:34:37
阅读次数：
72
一、CSS3 渐变（gradients）渐变效果CSS3 渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。CSS3 定义了两种类型的渐变（gradients）：线性渐变（Linear Gradients）- 向下/向上/向左/向右/对角方向径向渐变（Radial Grad... ...
分类：
Web程序 时间：
2020-02-05 16:22:47
阅读次数：
290
CSS3 渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。 渐变不是一个css属性，可以把它看成一个函数，通过传入参数（渐变方向和颜色）来返回一个视觉效果 1.线型渐变 linear gradient 基本用法:可以传入颜色值，也可以传入16进制颜色值，还可以是rgba( ...
分类：
Web程序 时间：
2019-10-01 18:00:15
阅读次数：
112
主要代码如下: 1 body { 2 background:#fff 3 } 4 /* Mixins */ 5 /* bg shortcodes */ 6 .bg-gradient1 span,.bg-gradient1:before { 7 background:#52A0FD; 8 backgr ...
分类：
Web程序 时间：
2019-08-28 11:00:13
阅读次数：
263
.box{ 子级 position: relative; width: 300px; height: 400px; display: flex; justify-content: center; align-content: center; background: #1B6D85; } .box::... ...
分类：
Web程序 时间：
2019-08-19 13:07:56
阅读次数：
108
