百分比padding值与等比例头图效果实例页面

展示

代码

• HTML：

  <div class="box">
      <img src="cover.jpg">
  </div>

• CSS：

  .box { 
      padding: 10% 50%;
      position: relative;
  }
  .box > img {
      position: absolute;
      width: 100%; height: 100%;
      left: 0; top: 0;
  }