CSS-自定义渐变背景

[code]

.custombg {
background: #f7ca65;
background: -moz-linear-gradient(-45deg,#f7ca65 0%,#f7ca65 25%,#f1c458 25.1%,#f1c458 79.8%,#f7ca65 80%,#f7ca65 100%);
background: -webkit-linear-gradient(
-45deg
,#f7ca65 0%,#f7ca65 25%,#f1c458 25.1%,#f1c458 79.8%,#f7ca65 80%,#f7ca65 100%);
background: linear-gradient(
135deg
,#f7ca65 0%,#f7ca65 25%,#f1c458 25.1%,#f1c458 79.8%,#f7ca65 80%,#f7ca65 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=’#f1c458′,endColorstr=’#f1c458′,GradientType=1 );
}

 

[/code]

[code]

.custombg2 {
background: -webkit-linear-gradient(
45deg
,#00bfff 0,#0888cf 15%,navy 100%);
background: -o-linear-gradient(45deg,#00bfff 0,#0888cf 15%,navy 100%);
background: linear-gradient(
45deg
,#00bfff 0,#0888cf 15%,navy 100%);
}
[/code]

[code]

border-top: 5px solid;
border-image: linear-gradient(to right, grey 25%, yellow 25%, yellow 50%,red 50%, red 75%, teal 75%) 5;

[/code]