box 是外层的伸缩框

inner是带有背景色的自适应矩形

inner里面的空div 设置margin: 50%;

inner的overflow: hidden;是关键  防止最里面的div的margin穿透 这样才能把inner撑开  显示背景色

最里面的空div左右margin: 50%;把水平方向撑开

上下margin: 50%;自身发生重叠，实现了宽高2:1的自适应

例：自适应矩形2:1margin：50%；（普通元素margin百分比无论哪个方向都是相对于自己的容器宽度计算的2:1是因为上下发生重叠）

margin:50%;