style{ background: url...}
<body>
<div id = 'content'>
BLABLABLABLABLBA
</div>
</body>
ブラウザウィンドウをトリミングした場合に自動的に再調整されるように、背景画像(css)を設定する方法を知りたいです。ただし、コンテンツを修正する必要があります。
ありがとう
style{ background: url...}
<body>
<div id = 'content'>
BLABLABLABLABLBA
</div>
</body>
ブラウザウィンドウをトリミングした場合に自動的に再調整されるように、背景画像(css)を設定する方法を知りたいです。ただし、コンテンツを修正する必要があります。
ありがとう
http://css-tricks.com/のperfect-full-page-background-imageという記事は、問題を理解するのに役立ちます。彼はあなたにすべての異なる方法を与えます。
ちなみに、#contentの幅を固定幅に保つ必要があります。
これは、画像を保持する内側のdivがを使用しているときに、外側のdivで使用する固定サイズの両方を持つプロセスを示すjsFiddleです。position:fixed
background-size:contain
編集:境界要件も含めるために追加のdivが使用されるようになりました!
編集-2:非抽象画像で:contain
はなく、でjsFiddleを更新しました。:cover
IE6-8などの古いブラウザの場合、 CSS3スタイルの使用を可能にする多くのプラグインから選択できます。backgroundSize.jsという名前のこのjQueryプラグインは、特にその使用:cover
との:contain
ために使用され、そのオプションが必要な場合はbackground-size
SOメンバーのLouis-Rémiによって提供されます。