1

だからここにあるのです。フッターdivがあります。素敵な背景を作りたかったのです。中央に画像が表示されます。背景はXbgパターンで左に無限に拡張されます背景はYbgパターンで右に無限に拡張されますこのように; XXXXXXXXXXXXXXimageYYYYYYYYYYYYY

次のコードはそれをしませんでした。私は何が間違っているのですか?

.subcontent {
    min-height:50px;
    width:100%;
    background:#00CC66;
}
.leftcontent {
    float:left;
    min-height:50px;
    width:100%;
    background:url(images/bg_lpattern.jpg) repeat-x;
}
.rightcontent {
    float:right;
    min-height:50px;
    width:100%;
    background:url(images/bg_rpattern.jpg) repeat-x;
}

  <div class="subcontent">
    <div class="leftcontent">
    </div>
    <img src="images/bg.jpg" alt="Insert Logo Here" name="Insert_logo" width="400px" height="50px" />
    <div class="rightcontent">
    </div>
  </div>
4

1 に答える 1

0

ロゴの正確な寸法がわからず、レイアウトが流動的である場合、これは複雑になる可能性があります。

幅:100%はdivを100%にストレッチし、次のフローティングdivを次の行に移動します。

1x6000pxのような大きな背景画像を使用して、その上にyリピートを作成してみませんか。とにかくその中央をオーバーレイ画像で覆うので、その下に何かがあるかどうかは関係ありません。

これを試して:

<div class="subcontent" style='width:100%; background: url("images/bg_pattern.jpg") repeat-y scroll center top #00CC66; border: 0 none; min-height:50px; text-align:center;'>
  <img src="images/bg.jpg" alt="Insert Logo Here" name="Insert_logo" width="400px" height="50px" />
</div>

bgpattern.jpgが非常に薄い画像である場合...または、(1行の色を引き伸ばすだけでなく)素敵な背景にする必要がある場合は、3000x6000程度の巨大な画像にして、背景として使用します。同じように機能します-ロゴの下の中央に配置され、6000pxの解像度に達するまで側面が拡張されます。

于 2012-05-14T11:23:50.140 に答える