スクロールと一緒にタイルの画像がついてこない

左下の画像のように本来ならば下にscrollするとともに画像もついてくるのについてきません。画像が大きすぎるのでしょうか？宜しくお願い致します。

html
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta charset="utf-8">
5    <title>CSS Practice</title>
6    <link rel="stylesheet" href="default1.css">
7  </head>
8  <body>
9    <p>Hello World!</p>
10    <p>Hello World!</p>
11    <p>Hello World!</p>
12    <p>Hello World!</p>
13    <p>Hello World!</p>
14    <p>Hello World!</p>
15    <p>Hello World!</p>
16    <p>Hello World!</p>
17    <p>Hello World!</p>
18    <p>Hello World!</p>
19    <p>Hello World!</p>
20    <p>Hello World!</p>
21    <p>Hello World!</p>
22    <p>Hello World!</p>
23    <p>Hello World!</p>
24    <p>Hello World!</p>
25    <p>Hello World!</p>
26    <p>Hello World!</p>
27    <p>Hello World!</p>
28    <p>Hello World!</p>
29    <p>Hello World!</p>
30    <p>Hello World!</p>
31    <p>Hello World!</p>
32    <p>Hello World!</p>
33    <p>Hello World!</p>
34    <p>Hello World!</p>
35    <p>Hello World!</p>
36    <p>Hello World!</p>
37    <p>Hello World!</p>
38    <p>Hello World!</p>
39    <p>Hello World!</p>
40    <p>Hello World!</p>
41    <p>Hello World!</p>
42    <p>Hello World!</p>
43    <p>Hello World!</p>
44    <p>Hello World!</p>
45    <p>Hello World!</p>
46    <p>Hello World!</p>
47    <p>Hello World!</p>
48    <p>Hello World!</p>
49    <p>Hello World!</p>
50    <p>Hello World!</p>
51    <p>Hello World!</p>
52    <p>Hello World!</p>
53    <p>Hello World!</p>
54    <p>Hello World!</p>
55    <p>Hello World!</p>
56    <p>Hello World!</p>
57  </body>
58</html>
59

css
1
2body {
3 background-color: silver;
4background-image:
5url('wall.jpg');
6background-repeat: no-repeat;
7background-attachment: scroll;
8
9}
10

リンク内容

行動規範の内容に同意します

回答1件

CSSを以下のようにしてはどうでしょうか？

CSS
1body {
2    background-color: silver;
3    background-image: url("wall.png");
4    background-repeat: no-repeat;
5    background-attachment: fixed;
6}

投稿2017/04/03 16:00

s8_chu

総合スコア14731

goforward

2017/04/03 16:04

はいfixedはできたのですがscrollができず、最新版になり、この操作が消えたとかも考えています

goforward

2017/04/03 16:05

ダブルクォーテーションでやってみます

goforward

2017/04/03 16:07

やっぱりfixedはできましたが、scrollできず、これはどっとインストールに聞いてみます

s8_chu

2017/04/03 16:07

scrollを指定したときにどのような動作を予想しているのでしょうか？

goforward

2017/04/03 16:10 編集

スクロールした少し後に遅れて左上にタイルが現れる感じです

goforward

2017/04/03 16:14 編集

リンク内容の2分8秒あたりの動作を予想しております

s8_chu

2017/04/03 16:39 編集

scrollを指定した場合、背景は要素自身に固定され、スクロールしても背景はスクロールしません。質問者さんが実現したいことを行うならば、scrollではなくfixedを使うのでは？

goforward

2017/04/03 16:26 編集

まだ勉強不足ですが背景をすべて銀色にして、この画像のタイルがとりうる一部分を白色にしたとき、attachmentがくっつくという意味ですので、ブラウザを小さくして、下にスクロールすると、タイルを母親として、スクロールを子供とすると、子供のほうがはやいので、母親は後から追いつくと理屈ということでしょうか？　比喩はあまり使いたくありませんが今回は申し訳ありません

goforward

2017/04/03 16:30

fixedだと私の中のイメージでは母親と子供が手をつないでいるように思われます

goforward

2017/04/03 16:34

頭がぼーとしていますので、また明日以降再考させていただきます

s8_chu

2017/04/03 16:38

わかりました。

行動規範の内容に同意します