css - 将 CSS Div 溢出到相邻的容器中(WordPress 创作)

Question

我正在尝试复制以下网站上的外观:http://lousrestaurant.net/

您会看到 Logo 的底部溢出到菜单栏上(WP 中的一个单独的 div)。标题 Logo 和菜单栏都是一个图像。 WP 生成菜单文本格式，所以只需要担心背景图像。

我用标题图像底部的菜单栏(实心带)对自己的标题图像进行了 Photoshop，但无法将其溢出到导航栏 div 上。

使用它，我已经部分成功了:

#branding img
{
clear: both;
display: block;
background-image:url('myimage.png');
background-size: 940px 185px;
background-repeat: no-repeat;
position: absolute;
}

虽然这很古怪，但有两个原因:

1. 然后需要设置主页容器的位置，因为它上面有 position:absolute。
2. 有些浏览器认为没有标题图片，因为我将上面的 CSS 插入到 style.css 中，并且没有使用 WP 的“非常有用”的标题图片 uploader 。

我有多年的 HTML 和 CSS 经验，但我对 WordPress 还是个新手，我想我已经被困在那里了。

Answer 1

如果你看一下他们的代码，基本上就是

<div id="header">
    <a href="/"></a>
    <div id="nav"></div>
</div>

他们将背景图像应用到 #header，然后让 a 占据该空间以供点击，因此它们不会溢出 div ，图像是包装元素的背景。看起来你正在添加一个元素来溢出它，如果你在层次结构中上升一个级别则不需要溢出。