具有修改后的 alpha 的渐变不会填满整个页面
Gradient with modified alpha doesn't fill whole page
我正在尝试创建一个填充整个页面的渐变 - 我已经设法让我的渐变填充整个页面,但是在通过更改 alpha 变量使渐变变暗后,我注意到一个不一致 -页面的主要部分看起来不错,但是当我向下滚动时,调暗出现问题 - 渐变的较暗区域没有扩散到页面的下部,如下所示:
Image is linked since I don't have high enough rep
CSS 代码在尝试了多种解决方案后确实是一团糟,但如下所示:
html {
margin: 0px;
height: 100%;
width: 100%;
}
body {
margin: 0px;
min-height: 100%;
width: 100%;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
background: rgb(54,174,0);
background: linear-gradient(135deg, rgba(54,174,0,1) 0%, rgba(55,0,174,1) 100%);
}
如何确保 alpha 修改覆盖整个页面?
我认为这不是 alpha 修改的问题。
你在主background
属性上面写了背景的子属性,下面background
属性会覆盖上面的属性。主要是 background-attachment
是导致问题的原因。
css
应该是这样的:
html {
margin: 0px;
height: 100%;
width: 100%;
}
body {
margin: 0px;
min-height: 100%;
width: 100%;
/*background: rgb(54,174,0);*/
/*background-repeat: no-repeat;*/
/*background-size: cover;*/
background: linear-gradient(135deg, rgba(54,174,0,1) 0%, rgba(55,0,174,1) 100%);
background-attachment: fixed;
}
注释行是多余的,因为 属性 被覆盖或设置为默认值。
我正在尝试创建一个填充整个页面的渐变 - 我已经设法让我的渐变填充整个页面,但是在通过更改 alpha 变量使渐变变暗后,我注意到一个不一致 -页面的主要部分看起来不错,但是当我向下滚动时,调暗出现问题 - 渐变的较暗区域没有扩散到页面的下部,如下所示:
Image is linked since I don't have high enough rep
CSS 代码在尝试了多种解决方案后确实是一团糟,但如下所示:
html {
margin: 0px;
height: 100%;
width: 100%;
}
body {
margin: 0px;
min-height: 100%;
width: 100%;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
background: rgb(54,174,0);
background: linear-gradient(135deg, rgba(54,174,0,1) 0%, rgba(55,0,174,1) 100%);
}
如何确保 alpha 修改覆盖整个页面?
我认为这不是 alpha 修改的问题。
你在主background
属性上面写了背景的子属性,下面background
属性会覆盖上面的属性。主要是 background-attachment
是导致问题的原因。
css
应该是这样的:
html {
margin: 0px;
height: 100%;
width: 100%;
}
body {
margin: 0px;
min-height: 100%;
width: 100%;
/*background: rgb(54,174,0);*/
/*background-repeat: no-repeat;*/
/*background-size: cover;*/
background: linear-gradient(135deg, rgba(54,174,0,1) 0%, rgba(55,0,174,1) 100%);
background-attachment: fixed;
}
注释行是多余的,因为 属性 被覆盖或设置为默认值。