5

絶対座標を使用せずに CSS で div をオーバーラップすることは可能ですか?つまり、相対位置を使用しますか?

背景画像を縦に 3 つに分割し、

  • 1つ目は左揃え、
  • 2つ目は途中で繰り返し、
  • 3枚目は右揃え

次に、メインのサイト コンテンツをその上に配置し、中央揃えにしたいと考えています。絶対配置を使用せずにこれを行う方法がわかりません。

      Kinda like this

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

      Different symbols = differnt background image or pattern

背景を 3 つの 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 に答える