5

是否可以在不使用绝对坐标的情况下将 div 与 CSS 重叠——也就是说，使用相对定位？

我有一个背景图像，我分成 3 个垂直部分，

  • 第一个是左对齐，
  • 第二个在中间重复，
  • 第三个是右对齐的

然后我想让我的主要网站内容居中。如果不使用绝对定位，我不确定如何做到这一点。

      Kinda like this

|$$$$$|**********************|&&&&&|
|$$$$$|**********************|&&&&&|
|$$$$$|----------------------|&&&&&|
|$$$$$|                      |&&&&&|
|$$$$$|                      |&&&&&|
|$$$$$|shakeyour<body></body>|&&&&&|
|$$$$$|                      |&&&&&|
|$$$$$|                      |&&&&&|
|$$$$$|----------------------|&&&&&|
|$$$$$|**********************|&&&&&|
|$$$$$|**********************|&&&&&|

      Different symbols = differnt background image or pattern

我正在考虑将背景设置为三个 div，然后将 body div 绝对定位，但我希望它位于宽屏显示的中心。有任何想法吗？

For example, the expected behavior under resizing:

|$$$$$|**********************|&&&&&|
|$$$$$|**********************|&&&&&|
|$$$|--------------------------|&&&|
|$$$|                          |&&&|
|$$$|                          |&&&|
|$$$|  shakeyour<body></body>  |&&&|
|$$$|                          |&&&|
|$$$|                          |&&&|
|$$$|--------------------------|&&&|
|$$$$$|**********************|&&&&&|
|$$$$$|**********************|&&&&&|

---  

|$$$$$|**********************|&&&&&|
|$$$$$|**********************|&&&&&|
|$|------------------------------|&|
|$|                              |&|
|$|                              |&|
|$|   shakeyour<body></body>     |&|
|$|                              |&|
|$|                              |&|
|$|------------------------------|&|
|$$$$$|**********************|&&&&&|
|$$$$$|**********************|&&&&&|
4

2 回答 2

2 
body {
   padding: 50px 20px;
   box-sizing: border-box;
}
于 2012-11-19T09:53:11.947 回答
0 
<div style="float: left; width: 20%;">Left</div>
<div style="float: left; width: 60%; margin: 0 20%;">Center</div>
<div style="float: right; width: 20%;">Right</div>

你需要这样的东西。当然，在 CSS 文件中移动样式，并添加您的背景。

于 2010-12-31T08:30:42.890 回答