gpt4 book ai didi

javascript - 如何在 JS 中使用数学设置 div 的高度?

转载 作者:行者123 更新时间:2023-11-30 11:35:09 25 4
gpt4 key购买 nike

我希望能够输入 div 的纵横比,而不必每次都在 CSS 中手动计算和输入高度。

这没什么大不了的,但是这样会更优雅,我想了解错误是什么以供将来引用。

window.onload = function() {
var x = document.getElementById("movie");
var ar = 1.33;
x.style.height = x.style.height / ar;
};
body {
background: black;
margin: 0 auto;
max-width: 200px;
height: auto;
}

#movie {
width: 200px;
height: 100px;
background: navy;
}

.t {
-webkit-animation: change 48s infinite;
-moz-animation: change 48s infinite;
-o-animation: change 48s infinite;
animation: change 48s infinite;
}

.name {
font-family: 'Alegreya Sans', Helvetica, sans-serif;
font-size: 13px;
color: gold;
text-align: center;
letter-spacing: 3px;
margin-top: 36px;
opacity: 0.3;
}

@keyframes change {
from {
background-color: black;
}
to {
background-color: white;
}
}
<body>
<div id="movie" class="t"></div>
<p class="name">Pedro Costa</p>
</body>

最佳答案

CSS 实际上有一个你可以使用的 calc 方法。

width: calc(100% - 100px);

例如:https://www.w3schools.com/cssref/tryit.asp?filename=trycss_func_calc

关于javascript - 如何在 JS 中使用数学设置 div 的高度?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44787591/

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