css如何使图片固定为正方形 div按比例布局，宽度为百分比，但又想让高度和宽度一样，即让div为正方形，怎么做布局呢？

一个元素要为正方形，height = width 就可以了

#box {
    width: 100%;
    height=width;
    
  }

显然这样是不行的；那要怎木样布局呢？

  #divBox {
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    position: relative;
    border:1px solid #eee;
  }
  #divBox img {
    position: absolute;
    width: 100%;
    height: 100%;
  }

原理：

这是一个css小技巧：当 padding-bottom/padding-top/margin-top/margin-bottom 的值为百分比的时候：

计算结果是参照父元素的宽度。

• 当我们设置height:0;padding-bottom:100%;
• 元素的宽高就始终保持一致了。
• width = height -> 正方形。