質問編集履歴

4

文章の追加

2021/02/02 12:55

投稿

music
music

スコア13

test CHANGED
File without changes
test CHANGED
@@ -12,6 +12,10 @@
12
12
 
13
13
 
14
14
 
15
+ ABOUTがlogoにかかっているのはデザインなので大丈夫です。
16
+
17
+
18
+
15
19
  始めたばかりで質問するのも申し訳ありませんが、
16
20
 
17
21
  調べつくし試しましたが一向に解決しません。

3

誤字の修正

2021/02/02 12:55

投稿

music
music

スコア13

test CHANGED
File without changes
test CHANGED
@@ -1,6 +1,6 @@
1
- ![イメージ説明](02c35e7fdd3d9baa812b864374a32c0d.png)### 前提・実現したいこと
1
+ ![イメージ説明](02c35e7fdd3d9baa812b864374a32c0d.png)
2
-
2
+
3
- **ヘッダーの下にある余白を消したいのと、赤塗りのものヘッダーに収めたいです。**
3
+ **ヘッダーの下にある余白を消したいのと、赤塗りのものヘッダーに収めたいです。**
4
4
 
5
5
 
6
6
 

2

画像追加

2021/02/02 10:04

投稿

music
music

スコア13

test CHANGED
File without changes
test CHANGED
@@ -1,6 +1,6 @@
1
- ### 前提・実現したいこと
2
-
3
- **ヘッダーの下にある余白を消したいです。**![![![イメージ説明](742ed0ec6d8a2259ef24dada6e895b21.png)](8057b90971c9173cd3aa60df53ef2241.png)](9ea356bea93626090030f1f119102d5d.png)
1
+ ![イメージ説明](02c35e7fdd3d9baa812b864374a32c0d.png)### 前提・実現したいこと
2
+
3
+ **ヘッダーの下にある余白を消したいのと、赤塗りのものがヘッダーに収めたいです。**
4
4
 
5
5
 
6
6
 

1

ソースコードの追加

2021/02/02 10:02

投稿

music
music

スコア13

test CHANGED
File without changes
test CHANGED
@@ -36,7 +36,267 @@
36
36
 
37
37
  ```ここに言語名を入力
38
38
 
39
+ <!DOCTYPE html>
40
+
41
+ <html lang="ja">
42
+
43
+ <head>
44
+
45
+ <meta charset="UTF-8">
46
+
47
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
48
+
49
+ <link rel="stylesheet" href="first.css">
50
+
51
+ <link rel="stylesheet" href="query-first.css">
52
+
53
+ <title>test_First</title>
54
+
55
+
56
+
57
+ </head>
58
+
59
+ <body>
60
+
61
+ <header id=page-top>
62
+
63
+ <nav>
64
+
65
+ <ul class="left">
66
+
67
+ <li><a href="#">FIRST</a></li>
68
+
69
+ <li><a href="#">PLAN</a></li>
70
+
71
+ <li><a href="#">SERVICE</a></li>
72
+
73
+ </ul>
74
+
75
+
76
+
77
+ <div class="logo">
78
+
79
+ <a href="arrivo.html"><img src="#" alt="サイトロゴ"></a>
80
+
81
+ </div>
82
+
83
+
84
+
85
+ <ul class="right">
86
+
87
+ <li><a href="#">ABOUT</a></li>
88
+
89
+ <li><a href="#">POINT</a></li>
90
+
91
+ <li><a href="#">CONTACT</a></li>
92
+
93
+ </ul>
94
+
95
+
96
+
97
+ <div class="map">
98
+
99
+ <a href="#">サイトマップ</a>
100
+
101
+ </div>
102
+
103
+ </nav>
104
+
105
+ <div class="clear"></div>
106
+
107
+ </header>
108
+
109
+
110
+
111
+ <div class="main">
112
+
113
+
114
+
115
+ <div class="title">
116
+
117
+ <h1>FIRST</h1>
118
+
119
+ </div>
120
+
121
+ </div>
122
+
123
+ </body>
124
+
125
+ </html>
126
+
127
+
128
+
129
+
130
+
131
+
132
+
133
+
134
+
135
+
136
+
137
+ body{
138
+
139
+ margin: 0;//auto
140
+
141
+ width: 1920px;
142
+
143
+ }
144
+
145
+
146
+
147
+ .clear{
148
+
149
+ clear: both;
150
+
151
+ }
152
+
153
+
154
+
39
- ソースコード
155
+ ul,li{
156
+
157
+ margin: 0;
158
+
159
+ padding: 0;
160
+
161
+ list-style: none;
162
+
163
+ }
164
+
165
+
166
+
167
+ a{
168
+
169
+ text-decoration: none;
170
+
171
+ }
172
+
173
+
174
+
175
+ nav{
176
+
177
+ height: 182px;
178
+
179
+ }
180
+
181
+
182
+
183
+ header{
184
+
185
+ width: 100%;
186
+
187
+ height: 182px;
188
+
189
+ background-color:rgb(189, 187, 187);
190
+
191
+
192
+
193
+ ul,li,img{
194
+
195
+ display: block;
196
+
197
+ float: left;
198
+
199
+ }
200
+
201
+
202
+
203
+ .left li{
204
+
205
+ margin: 111px 0 48px 116px;
206
+
207
+ font-size: 23px;
208
+
209
+ }
210
+
211
+ li:first-child{
212
+
213
+ font-size: 25px;
214
+
215
+ padding-bottom: 25px;
216
+
217
+ margin: 109px 0 0 207px;
218
+
219
+
220
+
221
+
222
+
223
+ }
224
+
225
+
226
+
227
+ .logo img{
228
+
229
+ width: 534px;
230
+
231
+ height: 112px;
232
+
233
+ background-color: black;
234
+
235
+ //↑質問にあたりロゴ非表示のため
236
+
237
+ margin: 39px 0 31px;
238
+
239
+ }
240
+
241
+
242
+
243
+ .right{
244
+
245
+
246
+
247
+ li{
248
+
249
+ font-size: 23px;
250
+
251
+ margin: 111px 0 48px 87px;
252
+
253
+ }
254
+
255
+ li:first-child{
256
+
257
+ margin: 111px 0 0 -5px;
258
+
259
+ }
260
+
261
+ }
262
+
263
+
264
+
265
+
266
+
267
+ .map{
268
+
269
+ display: inline-block;
270
+
271
+ margin: 52px 120px 110px 78px;
272
+
273
+
274
+
275
+ a{
276
+
277
+ background-color: red;
278
+
279
+ font-size: 15px;
280
+
281
+ }
282
+
283
+ }
284
+
285
+ }
286
+
287
+
288
+
289
+ .main{
290
+
291
+ background-color:#8BC4A7;
292
+
293
+ height: 500px;
294
+
295
+ width: 1920px;
296
+
297
+ }
298
+
299
+
40
300
 
41
301
  ```
42
302