回答編集履歴

1

追記

2018/09/23 00:48

投稿

yoshinavi
yoshinavi

スコア3523

test CHANGED
@@ -9,3 +9,27 @@
9
9
  一般的ではないのが、質問者さんの提示コード「background-size: 100vw 100vh;」です。
10
10
 
11
11
  これは「アスペクト比を無視して良いですよ」となり、写真が縦に伸びたりします。
12
+
13
+
14
+
15
+ -追記-
16
+
17
+ 隙間が出来ても良いので、写真(画像)をカットせず全て表示させたいのであれば「background-size:contain;」を使えば良いと思います。
18
+
19
+ ```CSS
20
+
21
+ body {
22
+
23
+ background: linear-gradient(-45deg,rgba(6, 210, 200, 0.9), rgba(0, 72, 150, 0.9)),
24
+
25
+ url(../../images/hoge.png);
26
+
27
+ background-size: contain;
28
+
29
+ background-position: center center;
30
+
31
+ background-repeat: no-repeat;
32
+
33
+ }
34
+
35
+ ```