padding百分比来做
这里需要运用一个小技巧,padding用百分比做单位时是相对于容器的宽度来算的。
.wrapper{
position : relative;
background: #ccc;
width: 10%;
padding-bottom : 20%;
}
.inner{
position : absolute;
top : 0; left : 0; right : 0; bottom : 0;
}
</style>
<div class="wrapper">
<div class="inner">
这是内容
</div>
</div>
此时,.wrapper就是高宽比固定的。 这个时候,可以使用 position:absolute,往页面中添加内容。
修改时间 2019-03-10
声明:本站所有文章和图片,如无特殊说明,均为原创发布。商业转载请联系作者获得授权,非商业转载请注明出处。