css布局，弹层内容不是固定的，底部有关闭按钮，需要根据内容的长度，始终停留在底部。

1.  detail为最外层弹窗，要用fixed绝对定位布局

  内容部分分为两部分  1是承载主体内容   2.存放关闭按钮

<div class="detail-cover" v-show="detailShow">
      <div class="detail-wrap clearfix" >
        <div class="detail-main">
          <p>我是内容部分</p>
          <p>我是内容部分</p>
          <p>我是内容部分</p>
          <p>我是内容部分</p>
          <p>我是内容部分</p>
        </div>
      </div>
      <div class="detail-close">
        <i class="icon-close iconsfont icons-guanbi"></i>      //关闭按钮
      </div>
</div>

 

.detail-cover{position: fixed; z-index: 100; top: 0; width: 100%; height: 100%; overflow: auto; background: rgba(7,17,27,0.8); color: #fff;     //弹窗，还是要用绝对定位布局
  .detail-wrap{min-height: 100%;       //此处需要设置最小高度，使得整体内容充满屏幕
    .detail-main{padding:px2rem(64) px2rem(20)  px2rem(128); text-align: left; line-height:px2rem(30);  }   //此处要设置：注意一定要设置padding-bottom值为x,这样可以使得主体内容部分跟屏幕底部始终存在一段距离，用来显示关闭按钮
  }
  .detail-close{position:relative; clear: both; width:px2rem(100); margin: px2rem(-128) auto 0; clear: both;    //此处布局关闭按钮，使用相对定位，注意一定要用margin-top:-x,使得关闭按钮在上述内容与底部的空白处
    .icon-close{display: block; color: #fff; font-size: px2rem(50);}     //关闭按钮样式
  }
}