如何使用两个div制作一个Photoshop风格的剪贴蒙版

Question

我有this代码，我希望使用.clip框为.ml创建剪贴蒙版效果，以便50vh以上的部分线为黑色，并且当用户滚动时，该行显示为变黑了。

.clip{
    position: fixed;
    z-index: 9999;
    top: 0;
    width: 100%;
    height: 50vh;
    background-color: #414141;
    clip: auto;
}

Answer 1

也许有背景附件：固定？

.dualbg {
  height:100vh;
  background:linear-gradient(to top, #333,#333) no-repeat rgba(0,0,0,0.3);
  background-size:100% 50%;
  width:3px;
  margin:50vh auto 0;
  background-attachment:fixed;

<div class="dualbg"></div>