0

HTML/CSS に与えられたこのデザインを実装するのに問題があります。ここに .psd があります: http://www.sendspace.com/file/10wuld

これまでのコードは次のとおりです: http://jsfiddle.net/wezW4/

ここにいくつかの視覚的なメモがあります: http://screencast.com/t/FMq6JK5weI

#content-background に position:relative を使用したところで行き詰まりました。配置した後、大きな空きスペースが残ります。ある友人は、ページの背景要素に絶対位置を設定する別のアプローチを提案しましたが、あまり進展しませんでした。

私の現在のアプローチでこれをどのように行うことができますか? または、私のアプローチが間違っている場合、正しいアプローチは何ですか?

4

1 に答える 1

1

次のようなことをしてください：

<html>
          <head>
                     <style>
                            #a, #b, #c {background-repeat:repeat-x;}
                            #a {background-image:url(http://dev.enhancetrade.com/prodetails/images/slider-background-5x5.jpg); background-position:center top;}
                            #c {background:white; width: 400px; margin: 0px auto;}
                            #b {background-image:url(http://dev.enhancetrade.com/prodetails/images/slider-background-5x5.jpg); background-position:center bottom;}
                     </style>
          </head>
          <body>
                     <div id="a">
                     <div id="b">
                     <div id="c">
                                adslfijaoifje
                                adslfijaoifje
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                                <p>asdjfoiajoiafeoi</p>
                     </div>
                     </div>
                     </div>
          </body>
</html>
于 2012-07-11T17:20:32.793 に答える