如何使用CSS实现响应式正方形。
html代码: <div id="mydiv"></div>
css代码:<style>
#mydiv {
position:absolute;
border:1px solid red;
padding: 0 20% 20% 0;
}
</style>
通过右内边距 = 下内边距,保证 div 为正方形,百分比的设定使得 div 的宽度随网页的变化而改变。
如何使用CSS实现响应式正方形。
html代码: <div id="mydiv"></div>
css代码:<style>
#mydiv {
position:absolute;
border:1px solid red;
padding: 0 20% 20% 0;
}
</style>
通过右内边距 = 下内边距,保证 div 为正方形,百分比的设定使得 div 的宽度随网页的变化而改变。