Question

我想使首页标题的顶部变暗。

这里是一个示例：www.reachlocal.com

您会注意到，标题顶部仅％的部分较暗，因此其导航菜单更加突出。

我在整个Google上进行搜索，试图找到渐变的顶部标题叠加层/不透明度/等。 CSS的。我只想将此应用到我的主页。有谁能帮助我？

迈克

Answer 1

对于初学者来说有点困难，我将需要您的代码为您提供更多帮助，但这是一个提示：

您可以使用伪类:::，在此之前是一个示例：

  .navtop::before{
              position: absolute;
               content:"";
               height:100px;
              width:100%;
              top:0;
              left:0;
              background: linear-gradient(rgba(0,0,0,1), 
                                      rgba(0,0,0,0));
              Z-index:-1;
               }

现在您的导航应该显示为深色/透明背景，只需使用代替.navtop即可。

编辑：我忘了添加位置：绝对

Answer 2

你的意思是这样吗？

#gradientbar{
background: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0));
position: absolute;
top: 0;
left: 0;
width: 100vw;
height: 150px;
}

是否仅在透明标题中添加渐变色顶部？

2 个答案: