<分区>
<分区>
例如，我有一个固定在页面顶部的导航栏(就像 Stackoverflow 上的导航栏一样)。
因此，body 的 padding-top 应该设置为导航栏的确切高度。
但是，这个导航栏的高度会不时变化，所以我不能依赖像 70px 这样的绝对值来分配给 body 的 padding-top 值。
所以，我正在寻找的是一种纯 CSS 的方法来确保此 padding-top 始终具有相同的值。
我也不能使用 var()，因为我事先不知道导航栏的最终高度。
谢谢。
最佳答案
你可以使用 javascript 而不是 css 来做到这一点，但无论如何，@Michael B 说可能还有其他方法。
使用 javascript 你可以做:
var nav = document.getElementById("navigationID");
console.log(nav.clientHeight);
// nav.clientHeight will return integer value of your navigation height.
var nav = document.getElementById("navigationID");
var container = document.getElementById("container");
container.style.paddingTop = nav.clientHeight + "px";#navigationID
{
color:#000;
height:70px;
width:100%;
border:4px solid green;
display:block;
position:absolute;
}
#container{
border:1px solid red;
display:block;
width:100%;
height:400px;
position:relative;
}<html>
<head>
</head>
<body>
<div id="navigationID"> navigation </div>
<div id="container">
container
</div>
</body>
</html>关于css - CSS 中有没有一种方法可以获取元素的高度(或其他属性)并与其他元素的属性共享相同的值？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/46941387/
相关文章：
angular - 如何更改 Angular Material 排序图标
html - 无法从高度为 100% 的 Flexbox 列中删除意外的反向缩进
ipad - 根据 iPad 的方向更改 html5 视频标签的 src
css - 水平对齐位置 :relative divs (CSS)
javascript - 如何在html中更改工具提示(div的标题)背景颜色
html - 将 youtube 视频包装在静态图像 "frame"中并保持响应式调整大小
javascript - Angular 无法读取未定义的属性 'Version'