当div的宽度为百分比时，如何设置高与宽相等

div {
  width: 20%;
  height: 0; // 设置高为0，让padding撑起高
  padding-bottom: 20%; /* 让div的高等于宽 */
  border-radius: 50%;
}

此时将padding-top/padding-bottom设置为百分比时，是基于父元素宽度，正好和width相等；在使用border-radius=50%，就实现了自适应的圆形。