回答編集履歴
1
説明追記
answer
CHANGED
|
@@ -1,4 +1,9 @@
|
|
|
1
|
-
https://flowr.is/ のサイトでは、メディアクエリで PCとスマホで背景画像を変えてますが、それについては把握してますか。
|
|
1
|
+
[https://flowr.is/](https://flowr.is/) のサイトでは、メディアクエリで PCとスマホで背景画像を変えてますが、それについては把握してますか。
|
|
2
2
|
|
|
3
3
|
提示のコードは、スマホ用の縦長の画像(750 X 1334 px)になってます。
|
|
4
|
-
PCで模写先サイトと同じにならないということなら、PC用のサイズの画像(2880 X 1789 px)に変更してください。
|
|
4
|
+
PCで模写先サイトと同じにならないということなら、PC用のサイズの画像(2880 X 1789 px)に変更してください。
|
|
5
|
+
|
|
6
|
+
模写先と同じようにレイアウトにしたいのなら `background-size: cover;` になります。
|
|
7
|
+
余白なしに画像を最大限表示するということになります。（一部欠けます。）
|
|
8
|
+
|
|
9
|
+
`background-size: contain;`だと画像はすべて表示されます。そのかわり上下か左右に余白ができます。
|