我可以使用 calc 和 var 根据宽度更改我的 div 高度吗？

Question

那么假设我的 divs width of 470px 是 100% 而 350px 是 0% of height .
从 100% 到 0% 我希望我的 divs height 从 100px 减少到 0px.

希望不要太混乱...

没有javascript可以吗？

用于空垫片 div。

Answer 1

你的问题有点令人困惑，但根据我的理解，如果你不想使用 JS，那么你可以使用 CSS 中的 calc 函数。同样的 Systex 如下：- div{ width: calc(100% - 100px); }

Answer 2

Codepen demo

CSS

div {
   background: #9bc;
   max-width: 470px;
   min-width: 350px;
   max-height: 100px;
   height: calc(0.83333 * 100vw - 291.66px);
   overflow: hidden;
}

身高已经用equation of the line passing from 2 points计算出来了。

我向您展示了计算结果，这样您就可以根据自己的喜好更改表达式

我可以使用 calc 和 var 根据宽度更改我的 div 高度吗？

Can I use calc and var to change my div height based on its width?

css

calc