1-19 改变父元素的透明度，不影响子元素的透明度

销户系统多券商开发

1.客户需要做一个挽留的modal，由于只有这家券商需要，暂时不封装成组件。写一个遮罩到页面即可

1-19 改变父元素的透明度，不影响子元素的透明度
写在最外层并使用fixed布局即可

<div class="img-modal">
      <img src="./assets/img/the-first.png" alt="" class="mask-img">
    </div>

样式注意写高度匹配

.img-modal{
  width: 100%;
  height: calc( 100vh - 90px );
  opacity: 0.6;
  background-color: black;
  bottom: 0;
  left: 0;
  position: fixed;
  z-index: 998;
}
.mask-img{
  width: 520px;
  height: 680px;
  opacity: 1;
  z-index: 999;
  position: fixed;
  top: 200px
  right: 114px;
}

2.但是发现祖先的透明度这样设置会影响到子元素，并且子元素无法改变透明度。所以要采用其他办法：
改变父元素的透明度，不影响子元素的透明度—css

简单来说就是使用父元素的透明度用rgba的方法

background:rgba(0,0,0,0.4);