Question

可能是一个简单的问题，但我看了几个其他主题，没有人遇到同样的问题。我试图在我页面的右上角设置一个标语（创建一个修改网站进行练习）。

                <div id="tagline">

                    <h3>Exams Made Easy</h3>

                </div>

#tagline {
background: url(images/Slogan.jpg) no-repeat;
}

我最初把h3放在那里，所以我可以计划出页面，但是如果我删除h3行，它将带jpg。我试图将标语右上方的标语jpg放在中央，左边是我的标识。

我的问题是：当我删除h3行，所以我只有jpg; h3和jpg都会消失。

另外，我尝试使用背景位置将标语置于右上方，我可以使用背景位置将其放置在右侧，但即使在y方向上的0px，它仍将放置在徽标下方。

感谢。

编辑标题HTML：

            <div id="header">

                <div id="logo">
                </div>

                <div id="tagline">
                </div>
                <div style="clear:both"></div>

                <ul id="menu">
                    <li><a href="#">Home</a></li>
                    <li><a href="#">Explanations</a></li>
                    <li><a href="#">Problems</a></li>
                    <li><a href="#">Products</a></li>
                    <li><a href="#">Contact</a></li>
                    <div style="clear:both"></div>
                </ul>

            </div> <!--End Header-->

Answer 1

没有h3标签，你的div没有内容，因此没有高度。您没有看到背景，因为没有为0px高度div显示的背景。

你可以尝试在你的css规则中给你的div一个高度（或最小高度）。

要解决图像的位置问题，如果您需要使用背景图像的解决方案，可以尝试两个重叠的div。基本上，你可以在你的第二个div上设置一个负边距 - 顶部（等于第一个div的高度）来拉起它并重叠第一个div。

在CSS中定位背景图片

1 个答案: