CSS 小技巧

1. 使用 padding-bottom 百分比进行提前占位，防止图片加载出现抖动

.img-box{
  overflow: hidden;
  width: 100%;
  height: 0;
  /* 50%是图片的高宽比例，切记是相对于父元素宽度的50%（即.img-box的上一级） */
  padding-bottom: 50%;
  img {
    width: 100%;
  }
}

2. scss妙用

.banner {
    width: 100px;
    &-img {
        width: 100%;
    }
}

等价于

.banner {
    width: 100px;
    .banner-img {
        width: 100%;
    }
}