teratail
回答率
85.47%
質問するログイン新規登録
トップに関する質問画像を画面の高さ100％で（比率を変えずに）表示させたい

編集履歴

質問編集履歴

1

css に書き直しました。

2017/07/13 04:39

投稿

i_haruka
i_haruka

スコア15

test CHANGED
File without changes
test CHANGED
@@ -14,42 +14,46 @@
14
14
 
15
15
 
16
16
 
17
- ```scss
17
+ ```css
18
18
 
19
- div.topimage{
19
+ div.topimage {
20
20
 
21
- width: 100%;
21
+ width: 100%;
22
22
 
23
- height: 700px;
23
+ height: 700px;
24
24
 
25
- overflow: hidden;
25
+ overflow: hidden;
26
-
27
- @include mq(sp){
28
-
29
- width:100%;
30
-
31
- height: 100vh;
32
-
33
- }
34
-
35
- img{
36
-
37
- width: 100%;
38
-
39
- @include mq(sp){
40
-
41
- width: auto;
42
-
43
- height: 100vh;
44
-
45
- }
46
-
47
- }
48
26
 
49
27
  }
50
28
 
29
+ div.topimage img {
30
+
31
+ width: 100%;
32
+
51
- ```
33
+ }
52
34
 
53
35
 
54
36
 
55
- @include mq(sp){}内がSP表示です
37
+ @media screen and (max-width: 740px) {
38
+
39
+ div.topimage {
40
+
41
+ height: 100vh;
42
+
43
+ width:auto;
44
+
45
+ }
46
+
47
+ div.topimage img {
48
+
49
+ height: 100vh;
50
+
51
+ width: auto;
52
+
53
+ }
54
+
55
+ }
56
+
57
+
58
+
59
+ ```