0

404 ページの背景として設定したい大きな画像があります。誰かがページをロードするたびに画像の幅を 100% にしたいので、画面が小さい場合は画像が小さくなり、画面が大きい場合は画像が伸びます。高さは幅に基づいて変更する必要があります。ページの高さである必要はありません。

私はこれのためのコードを持っていません。HTMLファイルとCSSファイルのどちらで行うのがよいでしょうか?

例として役立つJSfiddleを作成できますか? ありがとう！

4

5 に答える 5

2

これをコードに追加するだけCSSです...

body {
    background-image:url('http://imageshack.com/scaled/large/268/gjb.png');
    background-size:100%,100%;
}

そして、体を作ります...

<body>
<a href="http://dummycode.com">Dummy Code</a>
</body>

jsフィドル

于 2013-08-06T18:22:25.683 に答える
1

HTML 本文コンテンツ

none

CSS

html {
    background: url(http://www.astrophotography.co.nz/Lrg_Slides/20120619Milkyway.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

デモ(更新)

于 2013-08-06T18:20:16.600 に答える
1

あなたが本当に探しているのはbackground-attachment財産だと思います。

body { 
background-image:url('http://IMAGEURL');
background-attachment:fixed;
width: 100%;
}

ここで高さプロパティを設定する必要はありません。自動的に行われます。

于 2013-08-06T20:07:15.070 に答える
0

これはどう：

body{background:url(http://www.astrophotography.co.nz/Lrg_Slides/20120619Milkyway.jpg) 0 0 no-repeat; background-size:100% auto;}
于 2013-08-06T18:23:57.620 に答える