Html CSS相对于父对象的相对定位高度
尝试让多个“按钮”与动态背景图像一起移动。到目前为止，背景图像确实可以调整大小。许多按钮（包含工具提示和链接）的相对定位也起作用。。。。部分…将它们从左到右移动一个相对百分比，但不是从上到下移动。垂直方向上，按钮只是堆叠并保持在该位置。目标是让按钮保持在图像上的同一点附近，无论大小。我错过了什么？我是否不理解父/子流程？编码错误 CSS--- HtmlHtml CSS相对于父对象的相对定位高度,html,css,css-position,Html,Css,Css Position,尝试让多个“按钮”与动态背景图像一起移动。到目前为止，背景图像确实可以调整大小。许多按钮（包含工具提示和链接）的相对定位也起作用。。。。部分…将它们从左到右移动一个相对百分比，但不是从上到下移动。垂直方向上，按钮只是堆叠并保持在该位置。目标是让按钮保持在图像上的同一点附近，无论大小。我错过了什么？我是否不理解父/子流程？编码错误 CSS--- Html 我真的可以让“按钮”相对于背景图像（并在按钮上保留工具提示和链接）还是必须返回到绝对位置 是否有理由不使用绝对定位 你不需要绝对的位置，但是
我真的可以让“按钮”相对于背景图像（并在按钮上保留工具提示和链接）还是必须返回到绝对位置 是否有理由不使用绝对定位
你不需要绝对的位置，但是你可以考虑使用按钮本身的绝对定位。
“Absolute”的名称不正确……当一个项设置为Absolute时，它将相对于指定了“position”属性的最近父项进行绝对定位。将按钮的父项设置为“静态”，然后相对于该“静态”父项将按钮设置为“绝对”。这有点令人困惑，因为默认情况下父对象是“静态”的，但实际上将其指定为“静态”可以使用“绝对”将其子对象锚定到它。（您也可以将父项设置为“相对”或“绝对”。只要将其设置为-something-，它就会成为“绝对”子项锚定到的对象。）谢谢您的解释，John。很好，我可以补充一点。我想我现在明白了。事实上，我将所有按钮div都切换到position:absolute，并为它们的顶部和左侧提供了%的位置，现在所有东西都在两个方向上工作……接下来是媒体查询，这样我也可以调整按钮的大小
html {
background: url(img/tundrabiome.jpg) no-repeat center center fixed;
background-size: cover;
}
body {
font-family: helvetica, "times new roman", sans-serif;
font-size: 12px;
width:100%;
height: 100%;
}
#titleBtn {position: relative; top: 30%; left: 34%; background: url(img/tundratitle.png) no-repeat; width:379px; height:127px;}
#bearBtn {display: inline-block; position: relative; top: 65%; left: 24%; background: url(img/bearBtn.png) no-repeat; width:200px; height:200px;}
<html>
<body>
<a href="#" class="tooltip">
<div id="titleBtn">
<span style="margin-top:120px; margin-left:30px">
<strong>Tundra Biome</strong><br />
Lots of really cold information of life in an arctic tundra. Lots of really cold information of life in an arctic tundra. Lots of really cold information of life in an arctic tundra.
</span>
</div>
</a>
<a href="#" class="tooltip">
<div id="bearBtn">
<span style="margin-top:-30px; margin-left:-50px">
<strong>Bear</strong><br />
This is a really cute bear, isn't it?
</span>
</div>
</a>