应用视觉设计：创建一个 CSS 线性渐变 HTML元素的背景色并不局限于单色。css还提供了颜色过渡，也就是渐变。可以通过background里面的linear-gradient()来实现线性渐变，下面是它的语法： background:linear-gradient(gradient_direct ...
分类：
Web程序 时间：
2019-12-20 23:52:42
阅读次数：
143
渐变是CSS3中比较丰富多彩的一个特性，通过渐变我们可以实现许多绚丽的效果。渐变可分为线性渐变和径向渐变。 （1）线性渐变：沿着某条直线朝一个方向产生渐变效果 语法：linear-gradient([<point> || angle]? <stop>,<stop>[,<stop>]*) 参数说明： ...
分类：
Web程序 时间：
2019-12-07 14:10:23
阅读次数：
151
文本实现斑马线效果 <style> p { font-size: 17px; line-height: 25px; background-color: antiquewhite; background-image: linear-gradient(#99999 50%, transparent 0) ...
分类：
Web程序 时间：
2019-12-03 10:36:34
阅读次数：
227
一、实现思路 需求：画n个20 x 20的方格，作为元素div的背景图片 思路：利用CSS3的linear-gradient。 首先设置元素的background-size为20px 20px；利用linear-gradient为元素设置渐变的背景图片，分别向上下左右四个方向画0.5px的线。 二、 ...
分类：
Web程序 时间：
2019-12-02 19:18:08
阅读次数：
125
CSS创意与视觉表现 CSS代码： .cover { padding: 36% 50%; background: linear-gradient(to right, white 50%, black calc(50% + 1px)); position: relative; font-size: 2 ...
分类：
Web程序 时间：
2019-11-09 14:08:21
阅读次数：
143
CSS3 渐变（gradients）可以让你在两个或多个指定的颜色之间显示平稳的过渡。 渐变不是一个css属性，可以把它看成一个函数，通过传入参数（渐变方向和颜色）来返回一个视觉效果 1.线型渐变 linear gradient 基本用法:可以传入颜色值，也可以传入16进制颜色值，还可以是rgba( ...
分类：
Web程序 时间：
2019-10-01 18:00:15
阅读次数：
112
background: -moz-linear-gradient(top, #fe8f01 0%, #f52f26 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,##fe8f01), ... ...
分类：
Web程序 时间：
2019-09-16 13:39:42
阅读次数：
100
针对边框的渐变色其实有两种理解: 第一种是纯边框： 写法是： border:1px solid #ddd; border-image: -webkit-linear-gradient(#da9f11, #daa21e , #dbbc7b) 20 20; border-image: -moz-line ...
分类：
其他好文 时间：
2019-09-07 13:07:09
阅读次数：
94
背景色的渐变 1）线性渐变 background: -webkit-linear-gradient(60deg,#fff 10%, #f00 30%, #0f0 50%, #00f 70%, #000); 通过色号进行背景色线性渐变 background: -webkit-linear-gradie ...
分类：
其他好文 时间：
2019-09-07 13:04:07
阅读次数：
78
