background:-moz-linear-gradient( 起点方向,起点颜色,终点颜色); (2)Safari 4-5, Chrome 1-9 background:-webkit-linear-gradient( 起点方向,起点颜色,终点颜色); (3)Opera 11.10+ background:-o-linear-gradient( 起点方向,起点颜色,终点颜色); II、兼容IE filter:progid:DXImageTransform.Microsoft.gradient...
CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)。而我们今天主要是针对线性渐变来剖析其具体的用法。为了更好的应用CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器的内核,主流内容主要有Mozilla(Gecko)(熟悉的有 Firefox,Flock 等浏览器)、WebKit(熟悉的有Safari、Chrome等浏览器)、Op...
background:-moz-linear-gradient(left,#ace,#f96);/*Mozilla*/ background:-webkit-gradient(linear,050%,100%50%,from(#ace),to(#f96));/*Old gradient for webkit*/ background:-webkit-linear-gradient(left,#ace,#f96);/*new gradient for Webkit*/ background:-o-linear-gradient(left,#ace,#...
background-image: linear-gradient(angle, color-stop1, color-stop2);角度是指水平线和渐变线之间的角度,逆时针方向计算。换句话说,0deg 将创建一个从下到上的渐变,90deg 将创建一个从左到右的渐变。但是,请注意很多浏览器(Chrome、Safari、firefox等)的使用了旧的标准,即 0deg 将创建一个从左到右的渐变...
CSS3 Gradient分为linear-gradient(线性渐变)和radial-gradient(径向渐变)。 为了更好的应用CSS3 Gradient,我们需要先了解一下目前的几种现代浏览器的内核, 主流内容主要有Mozilla(熟悉的有Firefox,Flock等浏览器)、WebKit(熟悉的有Safari、Chrome等浏览器)、Opera(Opera浏览器)、Trident(讨厌的IE浏览器)。 本文照常忽...
CSS linear-gradient() 函数用于创建一个表示两种或多种颜色线性渐变的图片。其结果属于数据类型,是一种特别的数据类型。 渐变轴为45度,从蓝色渐变到红色 linear-gradient(45deg, blue, red); 从右下到左上、从蓝色渐变到红色 linear-gradient(to left top, blue, red); 从下到上,从蓝色开始渐变、到高度40...
background: -moz-linear-gradient(top,#ccc,#000); } 效果如下: 二、线性渐变在 Webkit 下的应用 语法: 1 2 -webkit-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* )//最新发布书写语法 -webkit-gradient(<type>, <point> [, <radius>]?, <point> [, <radius>]...
-webkit-linear-gradient( [<point>||<angle>,]?<stop>,<stop>[,<stop>]* ) -o-linear-gradient( [<point>||<angle>,]?<stop>,<stop>[,<stop>]* ) AI代码助手复制代码 具体应用如下: background:-moz-linear-gradient(left,#ace,#f96);/*Mozilla*/background:-webkit-gradient(linear,050%,10...
-webkit-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* ) -o-linear-gradient( [<point> || <angle>,]? <stop>, <stop> [, <stop>]* ) 1. 2. 3. 具体应用如下: background:-moz-linear-gradient(left,#ace,#f96);/*Mozilla*/ ...
background: linear-gradient(to bottom, #FFF 0%, #000 100%); 从上到下,从白渐变到黑的背景 2.重合的渐变线 渐变线上可以添加多个渐变节点,并且这些渐变节点是允许重合的,那么当渐变节点重合时,会发生什么状况呢? 回答: 会形成清晰的分界 background-image:linear-gradient(to bottom, #36C 0%, #36C ...