<style>
/*等比缩放*/
.box{
position: relative;
width: 100%; /* desired width */
background: #000;
color: #fff;
}
.box:before{
content: "";
display: block;
padding-top: 30%;
background: #f00;
}
.content{
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
</style>
<div class='box'>
<div class='content'>1:1</div>
</div>