这样设置渐变色透明的为什么不行呢？

Question

现在是这样的

background-image: linear-gradient(to bottom, rgba(13,33,102,1), rgba(14,26,67,0.7));

我想换成16进制的
发现这样写不行

background-image: linear-gradient(to bottom, #0D2166 100%, #111A43 70%);

只能用rgba模式吗

Answer 1

用 8 位的 hex 也可以：

background-image: linear-gradient(to bottom, #0D2166ff, #111A43b3);

Answer 2

这二个东西不是一个东西,一个是颜色的不透明度，一个是渐变的位置，自然效果不是一致的。

/* 从下到上，从蓝色开始渐变、到高度40%位置是绿色渐变开始、最后以红色结束 */
linear-gradient(0deg, blue, green 40%, red);

Answer 3

这个地方没用对
文档原话:

颜色终止列表中颜色的终止点应该是依次递增的。如果后面的颜色终止点小于前面颜色的终止点则后面的会被覆盖，从而创建一个硬转换.

也就是说你的70%,根本没起作用, 你这里的写法相当于linear-gradient(to bottom, #0D2166 100%, #111A43 100%) 所以看不出效果, 你可以linear-gradient(to bottom, #0D2166 70%, #111A43 100%)这样看一下效果, 是生效的