吸底样式的写法

具体实现的效果：
1、不满一屏的实现，按钮始终在页面的底部，如下图所示：

2、如果满一屏的话底部按钮按钮就会根据屏幕的长度始终在最后一行的底部，具体效果如下图所示：

下面我来说说这种布局的具体写法：
html

<div class="containter">
    <div class="content">
        <p>文字测试</p>
        <p>文字测试</p>
        <p>文字测试</p>
        <p>文字测试</p>
        <p>文字测试</p>
        <p>文字测试</p>
    </div>
    <div class="footer">我是底部</div>
</div>

css

*{
     margin:0;
     padding:0;
 }
 html,body{
      height:100%;
      font-size:60px;
  }
  .containter{
    background:pink;
    position: relative;
      min-height: 100%;
  }
  .content{
    text-align: left;
      padding-bottom: 24vw;
  }
  .footer{
      background:red;
      position: absolute;
      left: 6vw;
      right: 6vw;
      bottom: 6.66667vw;
  }

实现的效果和上图的效果是一样的