Css 防止“位置：粘滞；”的多行重叠标题（不计算/硬编码高度）

我希望有多行标题（例如，

h1

到

h6

），其中每个子标题直接粘贴在其上方的标题下方（每个

h6

粘贴在当前粘贴的

h5

的底部，它粘贴在当前粘贴的

h4

的底部，等等）

使用

时位置：粘性；排名：0

在所有粘性标题上，它们将在页面顶部重叠。不需要重叠：

h1, h2 {
  position: sticky;
  top: 0;
}

h1，h2{
位置：粘性；
排名：0；
}
div>div{
左边距：2米；
}

标题
内容

内容

内容

内容

内容

内容

a1收割台
a1含量

a1含量

a1含量

a1含量

a1含量

a1含量

a2收割台
a2含量

a2含量

a2含量

a2含量

a2含量

a2含量

a3收割台
a3含量

a3含量

a3含量

a3含量

a3含量

a3含量

b头
b含量

b含量

b含量

b含量

b含量

b含量

b1集管
b1含量

b1含量

b1含量

b1含量

b1含量

b1含量

b2割台
b2含量

b2含量

b2含量

b2含量

b2含量

b2含量

b3头
b3含量

b3含量

b3含量

b3含量

b3含量

b3含量

c头
c含量

c含量

c含量

c含量

c含量

c含量

c1头
c1含量

c1含量

c1含量

c1含量

c1含量

c1含量

c2总管
c2含量

c2含量

c2含量

c2含量

c2含量

c2含量

c3总管
c3含量

c3含量

c3含量

c3含量

c3含量

c3含量

我编写了一些JQuery代码来帮助您解决硬编码高度的问题。您可以使用.height（）函数来查找高度并使用javascript本身应用它，而不是一次又一次地对其进行硬编码和调整，如下面的代码片段所示

希望有帮助

$（文档）.ready（函数（）{
var h2=$（'h2'）.height（）；
变量h3=$（'h3'）。高度（）+h2；
变量h4=$（'h4'）。高度（）+h3；
变量h5=$（'h5'）。高度（）+h4；
变量h6=$（'h6'）。高度（）+h5；
$（“h2”）.css（“顶部”，h2）；
$（“h3”）.css（“顶部”，h3）；
$（“h4”）.css（“顶部”，h4）；
$（“h5”）.css（“顶部”，h5）；
$（“h6”）.css（“顶部”，h6）；
});
h1，
h2，
h3，
h4，
h5，
h6{
位置：粘性；
排名：0；
}
div>div{
左边距：2米；
}

标题
内容

内容

内容

内容

内容

内容

a1收割台
a1含量

a1含量

a1含量

a1含量

a1含量

a1含量

a3收割台
a3含量

a3含量

a3含量

a4标题
a4内容

a4内容

a4内容

a5收割台
a5内容

a5内容

a5内容

a6割台
a6含量

a6含量

a6含量

a2收割台
a2含量

a2含量

a2含量

a2含量

a2含量

a2含量

a3收割台
a3含量

a3含量

a3含量

a3含量

a3含量

a3含量

b头
b含量

b含量

b含量

b含量

b含量

b含量

b1集管
b1含量

b1含量

b1含量

b1含量

b1含量

b1含量

b2割台
b2含量

b2含量

b2含量

b2含量

b2含量

b2含量

b3头
b3含量

b3含量

b3含量

b3含量

b3含量

b3含量

c头
c含量

c含量

c含量

c含量

c含量

c含量

c1头
c1含量

c1含量

c1含量

c1含量

c1含量

c1含量

c2总管
c2含量

c2含量

c2含量

c2含量

c2含量

c2含量

c3总管
c3含量

c3含量

c3含量

c3含量

c3含量

c3含量

我一直在寻找一种无javascript的解决方案，但很高兴知道使用javascript仍然是合理的。谢谢。我确实在没有javascript的情况下尝试过，但是如果不在CSS中对值进行硬编码，就别无选择，因为我们正在使用sticky，当到达顶部时，它会从相对值切换到绝对值。如果您想避免CSS中的绝对值，JS是唯一更简单的选择。@uber5001，因为没有其他人回答或试图回答您的查询，如果您觉得这有帮助，请务必标记它。干杯我想了很久了我想