2

これが可能かどうか疑問に思っています。画像の背景位置を、背景である要素の左上ではなく、html ドキュメントの左上に設定する機能です。

疑似コード

body {
    background-image: url(someurlhere);
    background-position: top left;
}
element {
    background-image: url(sameurlhere);
    background-position: top left /*Relative to body not element*/;
}

この質問に他に何か提供する必要がある場合はお知らせください。修正しますが、それはかなり簡単だと確信しています。

編集: 絶対配置を使用できません。動的コンテンツを読み込んでいます。タイル化された画像をいくつかの要素の背景に合わせて、ページに穴が開いているように見せたいです。

編集2:問題をよりよく説明するための写真がいくつかあります。

図 1: ヘッダー要素の繰り返しパターンに注目してください。http://i.imgur.com/3lWguRE.png

写真 2: このバリエーションは、私が達成しようとしているものです。http://i.imgur.com/WtOeCQ2.png

4

3 に答える 3

7

body最初の質問は、要素に背景画像を設定するだけではない理由です。

しかし、それが適切でない場合は、要素の背景画像を に設定するオプションがあります。この場合、背景画像fixedはブラウザ ウィンドウの左上に固定され、スクロールしません。

element {background: url(image.fig) repeat fixed;}

ただし、背景は画面の左上隅から始まりますが、アタッチされている要素にのみ表示されます。(これは視差効果に便利です。)

EDIT:補足として、手書きの背景プロパティを使用している場合はfixed

background-attachment: fixed;
于 2013-06-06T02:38:54.683 に答える
0

要素を div アブソリュートでラップし、必要に応じて配置するだけです。

于 2013-06-06T02:25:05.043 に答える
0

要素のコンテキストについてもう少し情報を提供できますか? ポジショニングセットはありますか?ドキュメントのどこにありますか?正確に何を達成しようとしているのか、私には少しわかりません。

体に背景を入れることはできますか?

これにより、背景が左上に設定されますが、これが実際に達成しようとしているとは思えません。

<div class="test">
</div>

.test:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: url(http://i1112.photobucket.com/albums/k497/animalsbeingdicks/abd-318.gif);
  width: 352px;
  height: 263px;
}

http://jsbin.com/imurah/1/

于 2013-06-06T02:33:47.440 に答える