Html 如何使用'；绝对值'；位置？

好吧，我想弄明白为什么我不能让顶部的“蓝色”背景延伸到整个页面的宽度（而不是高度），同时保持位置“绝对”？这是我的页面和css：

http://dl.dropbox.com/u/20517056/jimedit2.css

---

正如你所看到的，我有100%的宽度，但它不会延伸。有什么想法吗？谢谢

这是因为您已将要扩展的div放置在id jimedit2的div中。此div的设置宽度为1024px，因此您的div将扩展到此宽度（其父div的宽度）。要修复此问题，请将其从其父分区中删除。

分区“jimedit2”的大小是固定的，即1024px 里面有“浅蓝色”的div。因此，它将只显示宽度为1024px的图像

试着把它从jimedit2分区拿出来

i、 e

---

你的问题会解决的。

这是你所寻找的问题的开始。你可以自己解决剩下的问题：

<style type="text/css">
body {margin: 0; padding: 0}
#blueBackground {
    background-repeat: repeat;
    background-image: url(http://dl.dropbox.com/u/20517056/jimedit2media/lightblue.gif);
    height: 121px
}
#wrapper {
    display: block;
    margin: 0 auto;
    width: 800px;
    background-color: red;
    top: -121;
    position: relative;
    height: 1000px;
}
</style>

<div id="blueBackground"></div>
<div id="wrapper">
        Put your central content in here
</div>

正文{边距：0；填充：0}
#蓝背景{
背景重复：重复；
背景图片：url(http://dl.dropbox.com/u/20517056/jimedit2media/lightblue.gif);
高度：121px
}
#包装纸{
显示：块；
保证金：0自动；
宽度：800px；
背景色：红色；
顶部：-121；
位置：相对位置；
高度：1000px；
}
把你的中心内容放在这里

不仅如此，背景图像本身是一个1024倍宽的单一图像，CSS中也没有重复应用。没有问题。。。Firebug、Chrome开发者工具等使调试这些东西时的生活变得更加轻松。好吧，我已经解决了这个问题，但是网站现在没有居中-这是一张图片：我想白色菜单现在只是移到了左边。有什么原因吗？@jtm22，给我们看看你的代码，背景图像的问题在你的代码中看起来是固定的，所以也许另一个新的JSFIDLE问题会出现？谢谢-下面是代码：白色菜单没有居中，这是问题=（花点时间在谷歌上寻找“CSS背景”你会发现大量的教程可以帮助你正确地创建、设置和重复背景图像。祝你好运。请提供一个简化的JSFIDDLOK，我已经解决了这个问题，但是网站现在没有居中-这里有一张图片：gyazo.com/140d882bfe0b594fea1f54079841f303有没有办法让白色菜单仍然居中，我们有交易？用上面的代码替换body标签内的代码..并且不要使用菜单分割，而是使用列表标签。主要问题仍然是bluebackGround没有达到浏览器窗口的100%宽度。我尝试添加宽度：100%，但它什么也没做，有什么原因吗？除此之外，只是清理了一些事情，这样我就可以完成这个-我不太担心精通将其转换为HTML，特别是我在Photoshop中大量修改的文本-这和白色菜单可以通过Photoshop图像添加吗？谢谢！是的，使用绝对定位。但我不建议这样做。看到这个JSFIDLE好吧！在我创建的白色菜单框中添加的最佳方式是什么（使用图像作为分隔符等等）？谢谢！对不起，我不再继续了。我来这里是为了帮助您不编写代码。如果您的代码真的卡住了，请雇佣一名web开发人员，或者做更多的研究。

<style type="text/css">
body {margin: 0; padding: 0}
#blueBackground {
    background-repeat: repeat;
    background-image: url(http://dl.dropbox.com/u/20517056/jimedit2media/lightblue.gif);
    height: 121px
}
#wrapper {
    display: block;
    margin: 0 auto;
    width: 800px;
    background-color: red;
    top: -121;
    position: relative;
    height: 1000px;
}
</style>

<div id="blueBackground"></div>
<div id="wrapper">
        Put your central content in here
</div>