0

我想知道是否有人可以帮助我修复我网页的顶部以保持不变。

我曾尝试使用 position:fixed 属性，但这会阻碍一切，因为我的内容与固定的 div 重叠。

我的网站在这里：

www.crookedcartoon.co.uk/print.html

我希望导航栏上方的所有内容，包括导航栏以保持粘在页面顶部以及在其下方滚动的内容。

我意识到这可能意味着我必须将我的大部分图像更改为 jpg 而不是 png。但是，我想知道这是否有任何问题？就像创建一条内容在其下方滚动然后消失的假线，而不是到达页面顶部，您将通过 PNG 图像的透明部分看到它。我真的不想使用 iframe，除非这是唯一的方法。

谢谢！

4

2 回答 2

3

Aniframe在这里肯定不是正确的选择。在你想放在上面的东西周围放一个div，放在上面并将position: fixed它定位到左上角。

<div class="ontop">
    <div id="top"></div>
    <div id="logo"></div>
    <div id="contact"></div>
    <div id="navbar"></div>
</div>

之后，添加一些等于 的margin-top高度。这是必要的，因为它已从文档流中取出（因为）并且内容将在它之下。#content-holder.ontopposition: fixed

如果您还添加background-color: white到.ontop，您的透明度问题就会消失。

试图复制您的设置，这是一个工作演示。

于 2013-07-02T10:14:22.937 回答
-1

你可以试试这个

请更新下面的css，因为我已经通过使底部的部分透明来更新图像，使顶部背景变为白色。[1 - 下载图像并检查它]

#ontop {
    background: inherit;
    height: auto;
    margin-top: -10px;
    position: fixed;
    z-index: 10;
}
#contact {
    background: none repeat scroll 0 0 white;
    height: 45px;
    margin-bottom: 1px;
    margin-left: -5px;
    margin-top: -8px;
    position: relative;
    vertical-align: top;
    width: 1127px;
}
#logo {
    height: 62px;
    margin-left: -10px;
    position: relative;
    width: 1127px;
    z-index: 1111;
}

] 1

于 2013-07-02T10:32:36.877 回答