标签：relative let 如何 strong box 项目 height art 计算
众所周知，一个元素要为正方形，
height = width就可以了。可是，如果高度是不限定的呢？如何自适应的保持正方形呢？
<style>
/* 这一段不必要 */
html,body {
height: 100%;
}
/* 以下是关键代码 */
#wrap {
width: 50%;
height: 100%;
background: #089e8a;
}
#box {
width: 100%;
height: 0;
padding-bottom: 100%;
position: relative;
background: #74b1f4;
}
#box img {
position: absolute;
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="wrap">
<div id="box"></div>
</div>
</body>
效果：
原理：
这是一个css小技巧：
当 padding-bottom/padding-top/margin-top/margin-bottom 的值为百分比的时候：
计算结果是参照父元素的宽度。
height:0;padding-bottom:100%;width = height -> 正方形。complete.
标签：relative let 如何 strong box 项目 height art 计算
原文地址：https://www.cnblogs.com/can-i-do/p/12864735.html
