css颜色渐变在不同浏览器的设置

在web开发中,难免会遇到浏览器之间的兼容问题,关于Css设置颜色渐变下面有解决的办法,直接上代码:

适用于谷歌浏览器:
background: -webkit-gradient(linear, 0 0, 0 100%, from(#4285fa), to(#366dcb));
from:是指渐变起始颜色
to:是指渐变结束的颜色

适用于火狐浏览器中
background: -moz-linear-gradient( top,#4285fa,#366dcb);
top:是值渐变方向从上向下
第一个颜色是指渐变起始颜色
第二个颜色是指渐变结束的颜色

适用于IE浏览器中
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#4285fa, endColorstr=#366dcb);
startColorstr:指渐变起始颜色
endColorstr:指渐变结束的颜色

转自:

http://www.cnblogs.com/MrALei/archive/2012/12/13/2816846.html

css颜色渐变在不同浏览器的设置

时间: 2024-10-10 02:23:53

css颜色渐变在不同浏览器的设置的相关文章

CSS 颜色渐变兼容

/* 颜色渐变兼容 */ #gradient { background: -moz-linear-gradient(top,#fff 0,#fef5e1 100%); background: -o-linear-gradient(top,#fff 0,#fef5e1 100%); background: linear-gradient(to bottom, #fff 0, #fef5e1 100%); filter:progid:DXImageTransform.Microsoft.gradie

css 颜色渐变

background: #1b6c9b; filter: alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=red,endcolorstr=blue,gradientType=1); -ms-filter: alpha(opacity=100 finishopacit

IE11中实现颜色渐变

background: -ms-linear-gradient(left,#daa23e,#ad7f27); 下面是css3中颜色渐变对各个浏览器的写法:background: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 */ background: -o-linear-gradient(red, blue); /* Opera 11.1 - 12.0 */ background: -moz-linear-gradient(re

CSS 实现背景色渐变和文字颜色渐变

1. 背景色渐变 A . linear-gradient:用线性渐变创建图像. 语法:<linear-gradient> = linear-gradient([ [ <angle> | to <side-or-corner> ] ,]? <color-stop>[, <color-stop>]+) 下述值用来表示渐变的方向,可以使用角度或者关键字来设置: <angle>:用角度值指定渐变的方向(或角度). to left: 设置渐变为

颜色渐变CSS

颜色渐变CSS IE系列 filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FF0000',endColorStr='#F9F900',gradientType='0'); 参数:startColorStr起始颜色 endColorStr结束颜色 gradientType为0时代表垂直,为1时代表水平 Firefox background: -moz-linear-gradient(top, #FF0000, #

css颜色属性及设置颜色的地方

css颜色属性 在css中用color属性规定文本的颜色. 默认值是not specified 有继承性,在javascript中语法是object.style.color="#FF0000" 取值方法 1,英文单词color:name;规定颜色值为颜色名称的颜色. 但是英文单词能够表达的颜色是有局限性的,不是所有的颜色都有英文名字,就像所有的颜色也不会都有中文字一样. 2,RGB(red红色,green绿色,blue蓝色) rgb格式,格式rgb(0,0,0): rgb格式,其实 就

CSS颜色设置与调色板

这里要介绍的是网页设置颜色包含有哪些:网页颜色规定规范. 1.常用颜色地方包含:字体颜色.超链接颜色.网页背景颜色.边框颜色2.颜色规范与颜色规定:网页使用RGB模式颜色 二.颜色基础知识 网页中颜色的运用是网页必不可少的一个元素.使用颜色目的在于有区别.有动感(特别是超链接中运用).美观之用,同时颜色也是各种各样网页的样式表现元素之一,了解CSS 字体颜色. 传统的html颜色与w3c标准下的css颜色对比和DIV CSS运用颜色 CSS color颜色语法: color:#000000; C

CSS颜色设置和调色板

CSS单位分析 px:单位代表像素,1px代表一个像素点. %:设置子元素为父容器的占比. em:代表该元素中一个字体所占字符,常用在文字首行缩进.其具有继承性. rem:始终代表html中的字符所在位置. vm:1vm代表占据视窗宽度的百分之1. vh:1vh代表占据视窗高度的百分之1. vmax:选取vh和vm中最大的哪一个. vmin:选取vh和vw中最小的哪一个. fr:并没有具体的值,代表一个均分单位,例如:在水平上只分出1fr,则1fr代表整个视窗宽度, 如分成3个1fr,则1fr代

前端基础学习-css文字颜色渐变的3种实现

在web前端开发过程中,UI设计师经常会设计一些带渐变文字的设计图,在以前我们只能用png的图片来代替文字,今天可以实现使用纯CSS实现渐变文字了.下面就介绍3中实现方式供大家参考! 基础样式: .gradient-text{text-align: left;text-indent:30px;line-height: 50px;font-size:40px;font-weight:bolder; position: relative; } 第一种方法,使用 background-cli. tex