请问这个对吗？那么从90到一百是什么颜色？为什么？

<!DOCTYPE html>

<html>

<head>

div{

width:400px;height:400px;border:1px solid red;

/*补充代码，给div元素设置背景渐变*/

background: -webkit-linear-gradient(left,rgba(255,0,0,0)20%,rgba(255,0,0,1)50%,rgba(0,255,0,.7) 90%); /* Safari 5.1 - 6 */

background: -o-linear-gradient(right,rgba(255,0,0,0)20%,rgba(255,0,0,1)50%,rgba(0,255,0,.7) 90%); /* Opera 11.1 - 12*/

background: -moz-linear-gradient(right,rgba(255,0,0,0)20%,rgba(255,0,0,1)50%,rgba(0,255,0,.7) 90%); /* Firefox 3.6 - 15*/

background: linear-gradient(to right, rgba(255,0,0,0)20%, rgba(255,0,0,1)50%,rgba(0,255,0,.7) 90%); /* 标准的语法 */

}

</style>

</head>

<body>

</body>

</html>

源自：CSS3背景与渐变 3-7 编程练习

收起

3回答

好帮手慕星星 2019-09-23 12:08:40

你好，

85%到90%是绿色到蓝色的过渡，结尾蓝色跟一开始红色区域是没有过度的，理解的没有问题，可以参考下面的图片：

自己再理解下。

好帮手慕星星 2019-09-20 17:00:51

你好，

1、将90%改成100%，也是50%~100%之间的过渡。

2、第二段代码理解的没有问题。

好帮手慕星星 2019-09-20 16:38:10

同学你好，

代码实现效果没有问题，很棒！

90%到100%为绿色，透明度为0.7 ，为50%~90%中间是从红色到绿色的过渡哦：

祝学习愉快！

提问者 weixin_慕后端7118097 #1

如果直接设置百分之100那也是过度吗？

2019-09-20 16:39:40
提问者 weixin_慕后端7118097 #2

background: -webkit-linear-gradient(red 10%, green 85%, blue 90%); /* Safari 5.1 - 6.0 */ background: -o-linear-gradient(red 10%, green 85%, blue 90%); /* Opera 11.1 - 12.0 */ background: -moz-linear-gradient(red 10%, green 85%, blue 90%); /* Firefox 3.6 - 15 */ background: linear-gradient(red 10%, green 85%, blue 90%); /* 标准的语法（必须放在最后） */ 请问这段代码的意思是这样吗？ /*代码解释为：红色是从0到10%,从10%到85%是红色到绿色的过度，85%到90%是绿色，蓝色是从90%到100%*/

2019-09-20 16:43:00
提问者 weixin_慕后端7118097 #3

那绿色到蓝色的过度呢？是不是也可以说85%到90%是绿色也是绿色到蓝色的过度？只有结尾蓝色跟一开始红色区域是没有过度的？

2019-09-20 19:02:14