固定/相对定位：

Question

我试图用两个“固定的”边栏图像和一个“固定的”标题图像来制作一个页面。因为标题是固定的(从顶部到10% )。我不希望标题图像与页面上的任何文本重叠。我尝试将段落标签定位为“相对的”，并将其从顶部设置为10%，但图像仍然与文本重叠。我该如何解决这个问题？

我的意思是：http://jsfiddle.net/KSz59/

.header {
    width: 70%;
    height: 10%;
    position: fixed;
    top: 0px;
    left: 15%;
    z-index: -1;
}

p {
    position: relative;
    top: 10%;
    margin-left: 20%;
    margin-right: 20%;
}

Answer 1

使用当前的设置，您将必须绝对地定位p。

http://jsfiddle.net/KSz59/2/

p {
    margin-left: 20%;
    margin-right: 20%;
    top: 10%;
    position: absolute;
}

如果您有更多的内容，那么最好将p替换为一个内容div，并将所有内容放在div中。