質問編集履歴
4
url変更のため削除
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -7,10 +7,6 @@
|
|
|
7
7
|
すぐに追加します。
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
https://ituki316.github.io/
|
|
12
|
-
|
|
13
|
-
現在上記URLでHP作成中ですが、背景画像がPCで見ると反映されていますが、スマホで見るとぼやけてしまいます。
|
|
14
10
|
|
|
15
11
|
[内容]
|
|
16
12
|
|
3
編集を追加しました
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -28,21 +28,21 @@
|
|
|
28
28
|
|
|
29
29
|
|
|
30
30
|
|
|
31
|
-
|
|
31
|
+
```html
|
|
32
32
|
|
|
33
33
|
**HTML **
|
|
34
34
|
|
|
35
|
+
<div class="skill">
|
|
35
36
|
|
|
37
|
+
<h1 class="sec03">Skill</h1>
|
|
36
38
|
|
|
37
|
-
|
|
39
|
+
</div>
|
|
38
40
|
|
|
39
|
-
<h1 class="sec03">Skill</h1>
|
|
40
|
-
|
|
41
|
-
|
|
41
|
+
```
|
|
42
42
|
|
|
43
43
|
|
|
44
44
|
|
|
45
|
-
|
|
45
|
+
```css
|
|
46
46
|
|
|
47
47
|
**CSS **
|
|
48
48
|
|
|
@@ -86,6 +86,16 @@
|
|
|
86
86
|
|
|
87
87
|
}
|
|
88
88
|
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
|
|
96
|
+
|
|
97
|
+
|
|
98
|
+
|
|
89
99
|
|
|
90
100
|
|
|
91
101
|
### 試したこと
|
2
またプラスでURLを付随したので見ていただければ幸いです。
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -7,6 +7,10 @@
|
|
|
7
7
|
すぐに追加します。
|
|
8
8
|
|
|
9
9
|
|
|
10
|
+
|
|
11
|
+
https://ituki316.github.io/
|
|
12
|
+
|
|
13
|
+
現在上記URLでHP作成中ですが、背景画像がPCで見ると反映されていますが、スマホで見るとぼやけてしまいます。
|
|
10
14
|
|
|
11
15
|
[内容]
|
|
12
16
|
|
1
ご指摘ありがとうございます。コードを画面と同じものに編集しました。Takumibooさんのおっしゃられている通りiPhoneのSafariで確認しました。pc画面でスクショしたものに変更しました。
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -10,15 +10,17 @@
|
|
|
10
10
|
|
|
11
11
|
[内容]
|
|
12
12
|
|
|
13
|
-
githubにあげているポートフォリオがpcでgooglechromeの検証を見るとレスポンシブできている画像が、スマートフォンでgithubを通じて見るとすごく拡大されるに加えて画質が大荒れ。
|
|
13
|
+
githubにあげているポートフォリオがpcでgooglechromeの検証を見るとレスポンシブできている画像が、スマートフォン(iPhoneのSafari)でgithubを通じて見るとすごく拡大されるに加えて画質が大荒れ。
|
|
14
14
|
|
|
15
15
|
[pcの場合]
|
|
16
16
|
|
|
17
|
-
|
|
18
18
|
|
|
19
|
-
[スマホの場合]
|
|
20
19
|
|
|
20
|
+
|
|
21
|
+
[スマホ(iPhoneのSafari)の場合]
|
|
22
|
+
|
|
21
|
-
|
|
22
24
|
|
|
23
25
|
|
|
24
26
|
|
|
@@ -26,33 +28,31 @@
|
|
|
26
28
|
|
|
27
29
|
**HTML **
|
|
28
30
|
|
|
29
|
-
<div class="hero">
|
|
30
31
|
|
|
32
|
+
|
|
31
|
-
<
|
|
33
|
+
<div class="skill">
|
|
34
|
+
|
|
35
|
+
<h1 class="sec03">Skill</h1>
|
|
32
36
|
|
|
33
37
|
</div>
|
|
34
38
|
|
|
35
39
|
|
|
36
40
|
|
|
41
|
+
|
|
42
|
+
|
|
37
43
|
**CSS **
|
|
38
44
|
|
|
39
|
-
.
|
|
45
|
+
.skill {
|
|
40
|
-
|
|
41
|
-
width: 100%;
|
|
42
|
-
|
|
43
|
-
height: 0;
|
|
44
46
|
|
|
45
47
|
position: relative;
|
|
46
48
|
|
|
47
|
-
background: url(
|
|
49
|
+
background: url(book.png) no-repeat center center fixed;
|
|
48
50
|
|
|
49
51
|
-webkit-background-size: cover;
|
|
50
52
|
|
|
51
53
|
-moz-background-size: cover;
|
|
52
54
|
|
|
53
55
|
background-size: cover;
|
|
54
|
-
|
|
55
|
-
text-align: center;
|
|
56
56
|
|
|
57
57
|
color: #fff;
|
|
58
58
|
|
|
@@ -62,7 +62,23 @@
|
|
|
62
62
|
|
|
63
63
|
letter-spacing: 2px;
|
|
64
64
|
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
.sec03{
|
|
70
|
+
|
|
71
|
+
text-align: center;
|
|
72
|
+
|
|
73
|
+
font-size: 30px;
|
|
74
|
+
|
|
75
|
+
line-height: 1.8;
|
|
76
|
+
|
|
77
|
+
text-transform: uppercase;
|
|
78
|
+
|
|
65
79
|
font-family: "Montserrat", sans-serif;
|
|
80
|
+
|
|
81
|
+
margin: 0;
|
|
66
82
|
|
|
67
83
|
}
|
|
68
84
|
|
|
@@ -76,7 +92,7 @@
|
|
|
76
92
|
|
|
77
93
|
|
|
78
94
|
|
|
79
|
-
chrome以外にpcのsafariで確認したが、正常に画像が反映した。そのためスマホの何かしらの影響が原因と考えられた。
|
|
95
|
+
chrome以外にpcのsafariで確認したが、正常に画像が反映した。そのためスマホ(iPhoneのSafari)の何かしらの影響が原因と考えられた。
|
|
80
96
|
|
|
81
97
|
|
|
82
98
|
|