css - 如何在页面顶部放置图像按钮

Question

我正在尝试在此页面顶部添加两个按钮:

http://213.229.81.180/~demo/

我已经通过输入以下代码成功地添加了它们:

<div class="hochzeit-button-header"><a href="http://213.229.81.180/~demo/portfolio-hochzeit/"><img id="hochzeit-button" src="http://213.229.81.180/~demo/wp-content/themes/creativepearl_child/btn_hochzeit.png" alt="hochzeit button" title="hochzeit button"></a></div>

<div class="portrait-button-header"><a href="http://213.229.81.180/~demo/portfolio-portrait/"><img id="portrait-button" src="http://213.229.81.180/~demo/wp-content/themes/creativepearl_child/btn_portrait.png" alt="portrait button" title="portrait button"></a></div>

问题仍然存在，现在菜单中的所有其他内容都已向下移动，因此标题变得太大。

我想让图片浮在菜单中其他内容的顶部，例如 facebook、google 加号按钮。

Answer 1

您需要将按钮绝对定位在标题内。为此，将 position:relative 添加到按钮的父元素并添加 position: absolute 和类似 top: 10px; right: 30px; 到按钮。