Interface Gradient Effect--CSS implementation--compatible with IE8

Special NOTE: The RGB color values inside must be fully written and cannot be abbreviated.

Around:
Background:-webkit-gradient (linear, 0 0, 0 100%, from (#80c1e7), to (#213c7c));   　　Background:-webkit-linear-gradient (left, #80c1e7, #213c7c);   　　Background:-moz-linear-gradient (left, #80c1e7, #213c7c);   　　Background:-o-linear-gradient (left, #80c1e7, #213c7c);   　　Background:-ms-linear-gradient (left, #80c1e7, #213c7c);   　　Background:linear-gradient (left, #80c1e7, #213c7c);   Filter:progid:DXImageTransform.Microsoft.gradient (GradientType = 1, StartColorStr = #80c1e7, endcolorstr = #213c7c);       Up and down: background:-webkit-gradient (linear, 0 0, 0 100%, from (#ffffff), to (#e8e8e8));       Background:-webkit-linear-gradient (top, #ffffff, #e8e8e8);       Background:-moz-linear-gradient (top, #ffffff, #e8e8e8);       Background:-o-linear-gradient (top, #ffffff, #e8e8e8);       Background:-ms-linear-gradient (top, #ffffff, #e8e8e8);       Background:linear-gradient (Top, #ffffff, #e8e8e8); Filter:progid:DXImageTransform.Microsoft.gradient (GradientType = 0, StartColorStr = #ffffFF, endcolorstr = #e8e8e8);    

　　

Context
Background:-webkit-linear-gradient (top, #ffffff, #f5f5f5);    Background:-moz-linear-gradient (top, #ffffff, #f5f5f5);    Background:-webkit-gradient (linear, Top, Bottom,from (#ffffff), to (#f5f5f5));    Background:linear-gradient (Top, #ffffff, #f5f5f5);    Background:-ms-linear-gradient (top, #ffffff, #f5f5f5); Filter:progid:DXImageTransform.Microsoft.gradient (gradienttype=0, startcolorstr= #ffffff, endcolorstr= #f5f5f5);    Around: Background:-webkit-linear-gradient (left, #41caf4, #5399f6);    Background:-moz-linear-gradient (left, #41caf4, #5399f6);    Background:-webkit-gradient (linear,left top,right top,from (#41caf4), to (#5399f6));    Background:linear-gradient (left, #41caf4, #5399f6);    Background:-ms-linear-gradient (left, #41caf4, #5399f6); Filter:progid:DXImageTransform.Microsoft.gradient (gradienttype=1, startcolorstr= #41caf4, endcolorstr= #5399f6); E Transparency: Filter:progid:DXImageTransform.Microsoft.Alpha (OPACITY=50); /*ie6~ie8*/Related instructions: The above filter code has three parameters, in order: StartColorStr, EndColorStr, and GradientType. where GThe radienttype=1 represents a horizontal gradient, and the gradienttype=0 represents a longitudinal transformation. Startcolorstr= "Color" represents the starting color of the gradient gradient, and endcolorstr= "color" represents the color at the end of the gradient. Filter:alpha (opacity=100 finishopacity=0 style=1 startx=0,starty=5,finishx=90,finishy=60) The meanings of each parameter are as follows: opacity indicates transparency , the default range is from 0 to 100, and they are actually in percent form. In other words, 0 is completely transparent and 100 is completely opaque. Finishopacity is an optional parameter that you can use to specify the transparency at the end if you want to set the transparency effect of the gradient. The range is also 0 to 100. Style is used to specify the shape characteristics of transparent areas: 0 for Uniform shape 1 for Line 2 for radial 3 for rectangles. StartX The x-coordinate at the beginning of the gradient transparency effect. Starty the y-coordinate at the beginning of the gradient transparency effect. Finishx The x-coordinate at the end of the gradient transparency effect. Finishy the y-coordinate at the end of the gradient transparency effect. Filter:alpha (opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) Progid:D    XImageTransform.Microsoft.gradient (startcolorstr=red,endcolorstr=blue,gradienttype=0); -ms-filter:alpha (opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) Progid:D XImageTransform.Microsoft.gradient (startcolorstr=red,endcolorstr=blue,gradienttype=0);/*ie8*/background:red;      /* Some browsers that do not support background gradients */background:-moz-linear-gradient (top, Red, RGBA (0, 0, 255, 0.5)); Background:-webkit-gradient (lineaR, 0 0, 0 bottom, from (#ff0000), to (RGBA (0, 0, 255, 0.5)));  Background:-o-linear-gradient (top, Red, RGBA (0, 0, 255, 0.5));

　　

Interface Gradient Effect--CSS implementation--compatible with IE8