Question

我用我的html和css代码顺利进行，直到我现在面临的这个问题，我不知道发生了什么。

我的html模式是这样的。

顶部的

是<div id="header">，没有任何固定的宽度。我使用了图像并使用了repeat-x属性。在标题中我有导航菜单包裹在940px的容器中;

中间的

是<div id="content">，它用相同的940px的容器包裹;

直到内容div我的代码很好。现在我正面临着正确定位页脚的问题。我的页脚不应该有任何固定的宽度，不应该包装在容器中。所以我在body和html标签关闭之前的内容和容器div之外定义了页脚div。

当我这样做时，页脚图像的尺寸为50px X 290px;向上，从内容div放置。它没有到底。我暂时使用margin-top:1600px;来正确定位，这是错误的。

为什么它不继承该位置，我尝试给出每个位置属性。它不起作用:(，

我错过了什么？

P.S：代码很长，所以我没有在这里发布，而是我解释了发生了什么。如果你仍然想看到我的代码我可以尝试并把最小的代码。

谢谢

编辑：这是jsfiddle和我的代码的链接。 http://jsfiddle.net/32ShZ/

Answer 1

问题似乎是#footer没有清除浮动的div（和天哪，你做就像你的div不是吗？70？在一个文件？）。所以，添加：

#footer {
clear: both;
width:940px; /* copied from your other divs */
}

似乎有效。我不确定，为什么#footer不尊重margin: 0 auto;但是，它似乎正在朝着正确的轨道前进。看看：jsfiddle.net/32ShZ/3/（你会注意到我已经使用了一些jQuery来填充所有div，所以我可以看到它在哪里。并添加background-color到#footer到使它更明显，这些，显然是可选的。）

已编辑以回复评论：

我对jQuery代码感到困惑。到底是什么。？

jQuery是一个JavaScript库，用于提供跨浏览器兼容的抽象，因此，在大多数情况下，一组代码应该产生跨浏览器的一致结果，从IE到Chrome。它的api可在线查看：jQuery.com。

$('div').each(
    function(i) {
        $(this).append('<p>Div (' + i + ') ' + $(this).attr('id') +'</p>');
    }
);

我一步一步使用的代码：

找到了网页上的所有div元素，$('div')
遍历每个元素，并应用了一个函数。 i是迭代器.each(function(i){...})
处理当前元素$(this)
在元素上附加<p>，文本内容为`.append（'
Div（'+ i +'）'+ $（this）.attr（'id'）+'
'）
$(this).attr('id')部分查看当前元素并找到其'id'属性，将其插入字符串中。

页脚不继承定位属性？

1 个答案: