マーケティングテキストの下にページの幅を走る波形を含むスプラッシュページを作成する必要があります。ページ設定は、自動マージン幅を持つ2つのマージン領域が隣接する960px幅のメインコンテンツ領域で構成されています。コンテンツ領域の背景として機能する波形画像を、余白の背景として機能する波形画像と位置合わせできるようにする必要があります。本質的に、波形ラインは、ユーザーのブラウザウィンドウサイズに関係なく、マージンとメインコンテンツ領域の間を視覚的に接続する必要があります。以下は、私が使用しなければならないテンプレートの簡単な例です(つまり、必要に応じて構造に追加できないということではありません)。誰かがこれを達成する方法について良い考えを持っているなら、私はあなたの入力をいただければ幸いです。
.main {
// not sure what to do here, but I know this isn't it
// background: url("margin-wave.jpg") no-repeat scroll left top transparent;
}
.content {
margin: 0 auto;
width: 960px;
background: url("main-wave.jpg") no-repeat scroll left top transparent;
}
<div class="main">
<div class="content">
...
</div>
</div>