回答編集履歴
5
誤字微修正
test
CHANGED
@@ -28,9 +28,11 @@
|
|
28
28
|
|
29
29
|
<img src="image/main.jpg" alt="店内写真”>
|
30
30
|
|
31
|
-
alt="店内写真” の後ろの引用符(クォーテーションマーク)~~ダブルコーテーション~~が半角引用符ではなく、別の
|
31
|
+
alt="店内写真” の後ろの引用符(クォーテーションマーク)~~ダブルコーテーション~~が半角引用符ではなく、別の記号に~~全角に~~なっていました。
|
32
32
|
|
33
|
-
他の箇所の半角の引用符は正しいものなので、「店内写真」入力後に全角のまま"を入力し、"に類似
|
33
|
+
他の箇所の半角の引用符は正しいものなので、「店内写真」入力後に全角のまま"を入力し、"に類似した別の記号に変換したのではないかと推察します。
|
34
|
+
|
35
|
+
|
34
36
|
|
35
37
|
**対策**
|
36
38
|
|
4
追記1の微修正と追記2(再発防止策)を追記
test
CHANGED
@@ -24,8 +24,78 @@
|
|
24
24
|
|
25
25
|
---
|
26
26
|
|
27
|
+
**原因**
|
28
|
+
|
27
29
|
<img src="image/main.jpg" alt="店内写真”>
|
28
30
|
|
29
|
-
alt="店内写真” の後ろのダブルコーテーションが全角になっていました。
|
31
|
+
alt="店内写真” の後ろの引用符(クォーテーションマーク)~~ダブルコーテーション~~が半角引用符ではなく、別の文字に~~全角に~~なっていました。
|
30
32
|
|
33
|
+
他の箇所の半角の引用符は正しいものなので、「店内写真」入力後に全角のまま"を入力し、"に類似ものに変換したのではないかと推察します。
|
34
|
+
|
35
|
+
**対策**
|
36
|
+
|
37
|
+
「店内写真」の直後の「”」を半角の引用符(クォーテーションマーク)~~ダブルコーテーション~~にすれば画像が表示されると思います。
|
38
|
+
|
39
|
+
|
40
|
+
|
41
|
+
追記2
|
42
|
+
|
43
|
+
---
|
44
|
+
|
45
|
+
今後の再発防止策として、以下を実施してはどうでしょうか
|
46
|
+
|
47
|
+
**1."を入力する際は必ず半角で入力する**
|
48
|
+
|
49
|
+
**2.メモ帳など簡易なエディタを使用しているのであれば、HTMLのコードミスがわかるエディタを使う**
|
50
|
+
|
51
|
+
「HTML エディタ おすすめ」あたりで検索してみてください。
|
52
|
+
|
53
|
+
以下はVisual Studio Codeというエディタですが、
|
54
|
+
|
55
|
+
正しく"が使われていれば、変更後に示したように正しく色分けがされます。
|
56
|
+
|
57
|
+
変更前は"が正しく閉じられていないため、「店内写真」以降がオレンジ色の文字になっています。
|
58
|
+
|
59
|
+
これにより何かがおかしいと気づくことができます。
|
60
|
+
|
61
|
+
|
62
|
+
|
63
|
+
変更前
|
64
|
+
|
65
|
+
![変更前](34a7b954e4f0965a62d5f4de17bb067a.png)
|
66
|
+
|
67
|
+
|
68
|
+
|
69
|
+
変更後
|
70
|
+
|
71
|
+
![変更後](92d6e938433e24e68145640b820e98f3.png)
|
72
|
+
|
73
|
+
|
74
|
+
|
75
|
+
**3.類似文字が判別しやすいフォントを使う**
|
76
|
+
|
77
|
+
以下の図に記載のある英数字4文字はunicodeという文字を表すコードで、()内が実際の文字を表しています。
|
78
|
+
|
79
|
+
参考:[Unicode C0制御文字と基本ラテン文字 - CyberLibrarian](http://www.asahi-net.or.jp/~ax2s-kmtn/ref/unicode/u0000.html#u0022)
|
80
|
+
|
81
|
+
0022が本来半角で"を入力したもの、201Dが今回入力されていたもの、その他"と似たようなものを集めました。フォントによっては 0022 201Dの判別がつきにくいです。
|
82
|
+
|
83
|
+
|
84
|
+
|
85
|
+
![メイリオ(Windows10フォント) ,Century](15d508f3d0aef9ab739c32c14f9081e3.png)
|
86
|
+
|
87
|
+
![MS ゴシック(メモ帳デフォルト)、白源](5400aae568669ed7640f30b7b0e8c37d.png)
|
88
|
+
|
89
|
+
|
90
|
+
|
91
|
+
以下もフォントサンプル
|
92
|
+
|
93
|
+
店内写真の直後の"は今回入力されていた 201Dの”です 直後の"が0022です。
|
94
|
+
|
31
|
-
|
95
|
+
文字幅や見た目がフォントによってだいぶ違うのがわかるかと思います。
|
96
|
+
|
97
|
+
![フォントサンプル](8fe5e94aa420469148dc55302cc12ea6.png)
|
98
|
+
|
99
|
+
|
100
|
+
|
101
|
+
どれがおすすめとは言えませんが、私は白源というプログラム用フォントを使っています。
|
3
回答追記
test
CHANGED
@@ -17,3 +17,15 @@
|
|
17
17
|
> ┗image
|
18
18
|
|
19
19
|
> ┗main.jpg
|
20
|
+
|
21
|
+
|
22
|
+
|
23
|
+
追記
|
24
|
+
|
25
|
+
---
|
26
|
+
|
27
|
+
<img src="image/main.jpg" alt="店内写真”>
|
28
|
+
|
29
|
+
alt="店内写真” の後ろのダブルコーテーションが全角になっていました。
|
30
|
+
|
31
|
+
半角のダブルコーテーションにすればいけると思います。
|
2
冒頭2行の文面を修正
test
CHANGED
@@ -1,4 +1,6 @@
|
|
1
|
-
ソースが質問から消えてしまいましたが、
|
1
|
+
ソースが質問から消えてしまいましたが、それはさておき。
|
2
|
+
|
3
|
+
glyzinieh様とのやりとりを拝見したところ、ファルダ構成が原因と思われます。
|
2
4
|
|
3
5
|
<img src="image/main.jpg">という記述は htmlのフォルダを基準に、直下のimageフォルダにあるmain.jpgを表します。
|
4
6
|
|
1
誤字修正
test
CHANGED
@@ -4,7 +4,7 @@
|
|
4
4
|
|
5
5
|
|
6
6
|
|
7
|
-
同じフォルダに移動して試してみて、と追記依頼をして混乱させてしまっているかもしれませんが、index.htmlをダウンロード直下に移して上記の構成にすれば解決するかと思います
|
7
|
+
同じフォルダに移動して試してみて、と追記依頼をして混乱させてしまっているかもしれませんが、index.htmlをダウンロード直下に移して下記(※上記となっていたので修正)の構成にすれば解決するかと思います
|
8
8
|
|
9
9
|
|
10
10
|
|