gpt4 book ai didi

html - 动态强制 div 的宽度等于它的高度

转载 作者:行者123 更新时间:2023-11-28 10:38:59 25 4
gpt4 key购买 nike

<分区>

在这里,我试图使 div 的宽度与其高度的尺寸完全相同,以便它保持完美的正方形。高度是它的父 div 的百分比,所以它的高度没有确切的像素值。

如果我不知道以像素为单位的确切高度,如何才能使 div 完美正方形?

我在下面给出了一个链接来证明我在说什么。在示例中,我希望青色 div 动态转换它的宽度以匹配它的高度尺寸,以便它保持一个完美的正方形。我希望能够在 CSS 代码中执行此操作,但如果不能,也没关系。

https://jsfiddle.net/5pdLpqrg/

CSS:

#parent{
height: 70px;
width: 450px;
background: #999;
resize: both;
overflow: auto;
}
#perfect_square{
height: 78%;
width: 80px;
background: cyan;
}

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com