質問編集履歴

5

誤字

2022/09/16 13:24

投稿

Shido
Shido

スコア2

test CHANGED
File without changes
test CHANGED
@@ -96,6 +96,7 @@
96
96
 
97
97
  ### 試したこと
98
98
  フォルダの階層に間違いがあるのかを確認しました。
99
+
99
100
  ご指摘頂いた通り、cssのフォルダが、大文字でCSSとなっていたため、小文字に直し、再度試してみました。
100
101
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/81eac077-ea70-49a1-810d-0bc0ffc8a64f.png)
101
102
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/13424e85-800e-4df3-9415-739fe6cb1af0.png)
@@ -103,6 +104,9 @@
103
104
  ### 補足情報(FW/ツールのバージョンなど)
104
105
  本の見本と見比べてみましたが、違いが分かりませんでした。
105
106
 
107
+ 以下が開発者ツールのスクリーンショットです。
108
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/f0c0bb77-1870-49ca-ae6e-73952c4f244d.png)
109
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/ec60e7dd-78e8-468b-8f59-880c28a2eb13.png)
106
110
  ### 見本のソースコード(私のコードはまだ途中ですので見本は、少し先の内容も含んだものです)
107
111
 
108
112
  ```html 

4

書式の修正

2022/09/16 10:55

投稿

Shido
Shido

スコア2

test CHANGED
File without changes
test CHANGED
@@ -18,7 +18,7 @@
18
18
  <!DOCTYPE html>
19
19
  <html>
20
20
  <head>
21
- <meta chrset="UTF-8">
21
+ <meta charset="UTF-8">
22
22
  <tiltle>サンプルページ</tiltle>
23
23
  <link href="css/style.css" rel="stylesheet">
24
24
  </head>
@@ -38,6 +38,7 @@
38
38
  </nav>
39
39
  </header>
40
40
  <!-- header終わり-->
41
+
41
42
  <!-- wrap始まり-->
42
43
  <div id="wrap">
43
44
  <div class="content"></div>
@@ -48,7 +49,8 @@
48
49
  <footer>
49
50
  <small>(c)2017 Hattori-studio.</small>
50
51
  </footer>
51
- <!-- footer終わり-->
52
+ <!-- footer終わり-->
53
+
52
54
  </body>
53
55
 
54
56
 
@@ -64,17 +66,39 @@
64
66
  margin:0;
65
67
  padding:0;
66
68
  background-color: #cccccc;
67
- color:#333333;![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/528b3f29-af96-4ad6-8730-85b8dd2f9eac.png)
69
+ color:#333333;
68
70
  font-size:15px;
69
71
  line-height:2;
70
72
  }
71
73
 
74
+ p,h1,h2,h3,h4,h5,h6 {
75
+ margin-top:0;
76
+ }
77
+
78
+ img{
79
+ vertical-align:bottom;
80
+ }
81
+
82
+ ul{
83
+ margin:0;
84
+ padding:0;
85
+ }
86
+
87
+ a{
88
+ color:#3583aa;
89
+ }
90
+
91
+ a:visited{
92
+ color:#788d98;
93
+ }
94
+
72
95
  ```
73
96
 
74
97
  ### 試したこと
75
98
  フォルダの階層に間違いがあるのかを確認しました。
76
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/fc786833-2030-4b7d-8ba7-93d38dba448f.png)
99
+ ご指摘頂いた通り、cssのフォルダが、大文字でCSSとなっていたため、小文字に直し、再度試してみました。
77
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/d11af212-0c68-4926-bd25-401460c9a48f.png)
100
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/81eac077-ea70-49a1-810d-0bc0ffc8a64f.png)
101
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/13424e85-800e-4df3-9415-739fe6cb1af0.png)
78
102
 
79
103
  ### 補足情報(FW/ツールのバージョンなど)
80
104
  本の見本と見比べてみましたが、違いが分かりませんでした。

3

書式の変更

2022/09/16 10:28

投稿

Shido
Shido

スコア2

test CHANGED
File without changes
test CHANGED
@@ -74,7 +74,7 @@
74
74
  ### 試したこと
75
75
  フォルダの階層に間違いがあるのかを確認しました。
76
76
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/fc786833-2030-4b7d-8ba7-93d38dba448f.png)
77
-
77
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/d11af212-0c68-4926-bd25-401460c9a48f.png)
78
78
 
79
79
  ### 補足情報(FW/ツールのバージョンなど)
80
80
  本の見本と見比べてみましたが、違いが分かりませんでした。

2

書式の変更

2022/09/16 10:25

投稿

Shido
Shido

スコア2

test CHANGED
File without changes
test CHANGED
@@ -2,9 +2,218 @@
2
2
 
3
3
  プログラミング初心者です。Bracketsを使用して、本で学んだ通りにコードを書いてみましたが、連携していないようです...
4
4
  過去の質問も参考に、問題解決に努めましたが、解決する事ができませんでした。どんな些細な事でも構いませんので、ご意見お聞かせ頂けますと幸いです。
5
+
6
+
7
+ ### 実現したいこと
8
+ HTMLとCSSを連携させたい。
9
+
10
+
11
+ ### 発生している問題・エラーメッセージ
12
+
13
+ CSSの色や、フォントを変更しても変化がないため、連動していないものと思います。
14
+
15
+ ### 該当のソースコード
16
+
17
+ ```HTML
18
+ <!DOCTYPE html>
19
+ <html>
20
+ <head>
21
+ <meta chrset="UTF-8">
22
+ <tiltle>サンプルページ</tiltle>
23
+ <link href="css/style.css" rel="stylesheet">
24
+ </head>
25
+ <body>
26
+
27
+ <!-- header始まり-->
28
+ <header>
29
+ <div class="logo">
30
+ <a href="index.html"><img src="images/logo.png" alt="SNAPPERS"></a>
31
+ </div>
32
+ <nav>
33
+ <ul class="global-nav">
34
+ <li><a href="portfolio.html">Portfolio</a></li>
35
+ <li><a href="about.html">About</a></li>
36
+ <li><a href="contact.html">Contact</a></li>
37
+ </ul>
38
+ </nav>
39
+ </header>
40
+ <!-- header終わり-->
41
+ <!-- wrap始まり-->
42
+ <div id="wrap">
43
+ <div class="content"></div>
44
+ </div>
45
+ <!-- wrap終わり-->
46
+
47
+ <!-- footer始まり-->
48
+ <footer>
49
+ <small>(c)2017 Hattori-studio.</small>
50
+ </footer>
51
+ <!-- footer終わり-->
52
+ </body>
53
+
54
+
55
+ </html>
56
+ ```
57
+
58
+ ### 該当のソースコード
59
+
60
+ ```CSS
61
+ @charset "utf-8;"
62
+
63
+ body{
64
+ margin:0;
65
+ padding:0;
66
+ background-color: #cccccc;
5
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/ec625999-a75f-45c0-9daf-3f8d8a0bebb3.png)
67
+ color:#333333;![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/528b3f29-af96-4ad6-8730-85b8dd2f9eac.png)
6
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/fe1d393c-0fb8-4378-a14c-213542d4ed6b.png)
68
+ font-size:15px;
69
+ line-height:2;
70
+ }
71
+
72
+ ```
73
+
74
+ ### 試したこと
75
+ フォルダの階層に間違いがあるのかを確認しました。
7
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/2cee65e0-e4b7-4e4d-bb4c-1848d480190e.png)
76
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/fc786833-2030-4b7d-8ba7-93d38dba448f.png)
77
+
78
+
79
+ ### 補足情報(FW/ツールのバージョンなど)
80
+ 本の見本と見比べてみましたが、違いが分かりませんでした。
81
+
82
+ ### 見本のソースコード(私のコードはまだ途中ですので見本は、少し先の内容も含んだものです)
83
+
84
+ ```html 
85
+ <!DOCTYPE html>
86
+ <html>
87
+ <head>
88
+ <meta charset="UTF-8">
89
+ <title>サンプルページ</title>
8
- ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/315a056e-9ab7-4eb0-91cb-45469034a80c.png)
90
+ <link href="https://fonts.googleapis.com/css?family=Bitter:400,700" rel="stylesheet">
9
-
91
+ <link href="css/style.css" rel="stylesheet">
10
-
92
+ </head>
93
+ <body>
94
+
95
+ <!-- header始まり -->
96
+ <header>
97
+ <div class="logo">
98
+ <a href="index.html"><img src="images/logo.png" alt="SNAPPERS"></a>
99
+ </div>
100
+ <nav>
101
+ <ul class="global-nav">
102
+ <li><a href="portfolio.html">Portfolio</a></li>
103
+ <li><a href="about.html">About</a></li>
104
+ <li><a href="contact.html">Contact</a></li>
105
+ </ul>
106
+ </nav>
107
+ </header>
108
+ <!-- header終わり -->
109
+
110
+ <!-- wrap始まり -->
111
+ <div id="wrap">
112
+ <div class="content">
113
+ </div>
114
+ </div>
115
+ <!-- wrap終わり -->
116
+
117
+ <!-- footer始まり -->
118
+ <footer>
119
+ <small>(C)2017 Hattori-studio.</small>
120
+ </footer>
121
+ <!-- footer終わり -->
122
+
123
+ </body>
124
+ </html>
125
+ ```
126
+
127
+ ### 見本のソースコード(見本は、少し先の内容も含んだものです)
128
+ ```CSS
129
+ @charset "utf-8";
130
+
131
+ body {
132
+ margin: 0;
133
+ padding: 0;
134
+ background-color: #cccccc;
135
+ color: #333333;
136
+ font-size: 15px;
137
+ line-height: 2;
138
+ }
139
+
140
+ p,h1,h2,h3,h4,h5,h6 {
141
+ margin-top: 0;
142
+ }
143
+
144
+ img {
145
+ vertical-align:bottom;
146
+ }
147
+
148
+ ul {
149
+ margin: 0;
150
+ padding: 0;
151
+ }
152
+
153
+ a {
154
+ color: #3583aa;
155
+ text-decoration: none;
156
+ }
157
+
158
+ a:visited {
159
+ color: #788d98;
160
+ }
161
+
162
+ a:hover {
163
+ text-decoration: underline;
164
+ }
165
+
166
+ header {
167
+ width: 960px;
168
+ height: 100px;
169
+ margin: 0 auto;
170
+ }
171
+
172
+ .logo {
173
+ float: left;
174
+ margin-top: 50px;
175
+ }
176
+
177
+ .global-nav {
178
+ float: right;
179
+ margin-top: 60px;
180
+ }
181
+
182
+ .global-nav li {
183
+ float: left;
184
+ margin: 0 20px;
185
+ font-size: 20px;
186
+ list-style: none;
187
+ font-family: 'Bitter', serif;
188
+ }
189
+
190
+ .global-nav li a {
191
+ color: #ffffff;
192
+ }
193
+
194
+ .global-nav li a:hover {
195
+ border-bottom: 2px solid #ffffff;
196
+ padding-bottom: 3px;
197
+ text-decoration: none;
198
+ }
199
+
200
+ #wrap {
201
+ clear: both;
202
+ }
203
+
204
+ .content {
205
+ width: 960px;
206
+ margin: 0 auto;
207
+ }
208
+
209
+ footer {
210
+ text-align: center;
211
+ color: #ffffff;
212
+ padding: 20px 0;
213
+ }
214
+
215
+ footer small {
216
+ font-size: 12px;
217
+ }
218
+ ```
219
+

1

文章の変更

2022/09/16 08:06

投稿

Shido
Shido

スコア2

test CHANGED
File without changes
test CHANGED
@@ -7,33 +7,4 @@
7
7
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/2cee65e0-e4b7-4e4d-bb4c-1848d480190e.png)
8
8
  ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-09-16/315a056e-9ab7-4eb0-91cb-45469034a80c.png)
9
9
 
10
- ここに質問の内容を詳しく書いてください。
11
- (例)
12
- TypeScriptで●●なシステムを作っています。
13
- ■■な機能を実装中に以下のエラーメッセージが発生しました。
14
10
 
15
- ### 実現したいこと
16
-
17
- ここに実現したいことを箇条書きで書いてください。
18
- - [ ] ▲▲機能を動作するようにする
19
-
20
- ### 発生している問題・エラーメッセージ
21
-
22
- ```
23
- エラーメッセージ
24
- ```
25
-
26
- ### 該当のソースコード
27
-
28
- ```ここに言語名を入力
29
- ソースコード
30
- ```
31
-
32
- ### 試したこと
33
-
34
- ここに問題に対して試したことを記載してください。
35
-
36
- ### 補足情報(FW/ツールのバージョンなど)
37
-
38
- ここにより詳細な情報を記載してください。
39
-