質問編集履歴

3

新しく、直したコードを追加しました

2020/02/25 06:35

投稿

yyymmm
yyymmm

スコア30

test CHANGED
File without changes
test CHANGED
@@ -18,6 +18,12 @@
18
18
 
19
19
  ```ここに言語を入力
20
20
 
21
+ 古いほうのコード↓
22
+
23
+
24
+
25
+
26
+
21
27
  html
22
28
 
23
29
 
@@ -232,4 +238,276 @@
232
238
 
233
239
 
234
240
 
241
+ 新しいほうのコードを以下に載せます!!!
242
+
243
+
244
+
245
+ ```html
246
+
247
+
248
+
249
+
250
+
251
+
252
+
253
+
254
+
255
+
256
+
257
+ <!-- headerここから-->
258
+
259
+ <header>
260
+
261
+ <h1><img src="images/logo.png" alt="----のホームページ" /></h1>
262
+
263
+
264
+
265
+ <section class="header_01">
266
+
267
+
268
+
269
+ <section class="icon">
270
+
271
+ <ul>
272
+
273
+ <li>
274
+
275
+ <a href="#"><img src="images/blog.png" class="sns"/></a>
276
+
277
+ </li>
278
+
279
+ <li>
280
+
281
+ <a href="#"><img src="images/radio.png" class="sns"/></a>
282
+
283
+ </li>
284
+
285
+ <li>
286
+
287
+ <a href="#"><img src="images/twitter.png" class="sns"/></a>
288
+
289
+ </li>
290
+
291
+ <li>
292
+
293
+ <a href="#"><img src="images/youtube.png" class="sns"/></a>
294
+
295
+ </li>
296
+
297
+ </ul>
298
+
299
+ </section>
300
+
301
+
302
+
303
+ <nav>
304
+
305
+ <ul>
306
+
307
+ <li><a href="index.html">ホーム</a></li>
308
+
309
+ <li><a href="introduction_new.html">自己紹介</a></li>
310
+
311
+ <li><a href="live.html">ライブ情報</a></li>
312
+
313
+ <li><a href="disc.html">CD/DVD</a></li>
314
+
315
+ <li><a href="media.html">メディア出演</a></li>
316
+
317
+ <li><a href="contact.html">問い合わせ</a></li>
318
+
319
+ </ul>
320
+
321
+ </nav>
322
+
323
+
324
+
325
+ </section>
326
+
327
+ </header>
328
+
329
+ <!-- headerここまで-->
330
+
331
+
332
+
333
+
334
+
335
+
336
+
337
+ CSS
338
+
339
+
340
+
341
+
342
+
343
+ header{
344
+
345
+ max-width: 960px;
346
+
347
+ height: 99px;
348
+
349
+ display: flex;
350
+
351
+ margin: 0 auto;
352
+
353
+ justify-content:space-between; /*それぞれを両端に寄せる*/
354
+
355
+
356
+
357
+
358
+
359
+ }
360
+
361
+
362
+
363
+ header h1 {
364
+
365
+ width: 213px;
366
+
367
+ margin-top: 20px;
368
+
369
+ }
370
+
371
+
372
+
373
+ .sns{
374
+
375
+ width: 20px;
376
+
377
+ height: 20px;
378
+
379
+
380
+
381
+ }
382
+
383
+
384
+
385
+ .header_01{
386
+
387
+ margin-top: 20px;
388
+
389
+ }
390
+
391
+
392
+
393
+ .header_01 ul{
394
+
395
+ display: flex;
396
+
397
+ background-color: #73b55e;
398
+
399
+
400
+
401
+
402
+
403
+ }
404
+
405
+
406
+
407
+ .header_01 ul li{
408
+
409
+ margin: 5px;
410
+
411
+ }
412
+
413
+
414
+
415
+
416
+
417
+
418
+
419
+ .icon ul{
420
+
421
+ display: flex;
422
+
423
+ }
424
+
425
+
426
+
427
+
428
+
429
+
430
+
431
+
432
+
433
+ nav ul{
434
+
435
+ display: flex;
436
+
437
+
438
+
439
+ }
440
+
441
+
442
+
443
+ nav ul li{
444
+
445
+ margin-left: 20px;
446
+
447
+ }
448
+
449
+
450
+
451
+ nav ul li a{
452
+
453
+ color: #555555;
454
+
455
+ text-decoration: none;
456
+
457
+ font-size: 14px;
458
+
459
+ font-weight: bold;
460
+
461
+ }
462
+
463
+
464
+
465
+ nav ul li a:hover{
466
+
467
+ color: #73b55e;
468
+
469
+ }
470
+
471
+
472
+
473
+
474
+
475
+
476
+
477
+
478
+
479
+
480
+
481
+
482
+
483
+
484
+
485
+
486
+
487
+
488
+
489
+
490
+
491
+
492
+
493
+
494
+
495
+
496
+
497
+
498
+
499
+
500
+
501
+
502
+
503
+ コード
504
+
505
+ ```
506
+
507
+
508
+
509
+
510
+
511
+ リスト部分、わかりやすく色をつけています。↓
512
+
235
- ![リスト部分、わかりやすく色をつけています。](b91bc1d0a35d0b50a277aeab9fd5f3c9.png)
513
+ ![](b91bc1d0a35d0b50a277aeab9fd5f3c9.png)

2

画像追加しました

2020/02/25 06:35

投稿

yyymmm
yyymmm

スコア30

test CHANGED
File without changes
test CHANGED
@@ -227,3 +227,9 @@
227
227
 
228
228
 
229
229
  ```
230
+
231
+
232
+
233
+
234
+
235
+ ![リスト部分、わかりやすく色をつけています。](b91bc1d0a35d0b50a277aeab9fd5f3c9.png)

1

コードを追加しました。

2020/02/25 06:33

投稿

yyymmm
yyymmm

スコア30

test CHANGED
File without changes
test CHANGED
@@ -11,3 +11,219 @@
11
11
 
12
12
 
13
13
  よろしくお願いします![イメージ説明](2d029a953320101af51c8ff7f6946937.png)
14
+
15
+
16
+
17
+
18
+
19
+ ```ここに言語を入力
20
+
21
+ html
22
+
23
+
24
+
25
+
26
+
27
+ <header>
28
+
29
+ <h1><img src="images/logo.png" alt="----" /></h1>
30
+
31
+
32
+
33
+ <section class="header_01">
34
+
35
+ <ul>
36
+
37
+ <li>
38
+
39
+ <a href="#"><img src="images/blog.png" class="sns"/></a>
40
+
41
+ </li>
42
+
43
+ <li>
44
+
45
+ <a href="#"><img src="images/radio.png" class="sns"/></a>
46
+
47
+ </li>
48
+
49
+ <li>
50
+
51
+ <a href="#"><img src="images/twitter.png" class="sns"/></a>
52
+
53
+ </li>
54
+
55
+ <li>
56
+
57
+ <a href="#"><img src="images/youtube.png" class="sns"/></a>
58
+
59
+ </li>
60
+
61
+ </ul>
62
+
63
+
64
+
65
+ <nav>
66
+
67
+ <ul>
68
+
69
+ <li><a href="index.html">ホーム</a></li>
70
+
71
+ <li><a href="introduction_new.html">自己紹介</a></li>
72
+
73
+ <li><a href="live.html">ライブ情報</a></li>
74
+
75
+ <li><a href="disc.html">CD/DVD</a></li>
76
+
77
+ <li><a href="media.html">メディア出演</a></li>
78
+
79
+ <li><a href="contact.html">問い合わせ</a></li>
80
+
81
+ </ul>
82
+
83
+ </nav>
84
+
85
+ </section>
86
+
87
+ </header>
88
+
89
+
90
+
91
+
92
+
93
+
94
+
95
+ css
96
+
97
+
98
+
99
+
100
+
101
+ header{
102
+
103
+ width: 960px;
104
+
105
+ height: 99px;
106
+
107
+ display: flex;
108
+
109
+ margin: 0 auto;
110
+
111
+ justify-content:space-between; /*それぞれを両端に寄せる*/
112
+
113
+
114
+
115
+ }
116
+
117
+
118
+
119
+ header h1 {
120
+
121
+ width: 213px;
122
+
123
+ margin-top: 20px;
124
+
125
+ }
126
+
127
+
128
+
129
+ .sns{
130
+
131
+ width: 20px;
132
+
133
+ height: 20px;
134
+
135
+
136
+
137
+ }
138
+
139
+
140
+
141
+ .header_01 ul{
142
+
143
+ display: flex;
144
+
145
+
146
+
147
+ }
148
+
149
+
150
+
151
+ .header_01 ul li{
152
+
153
+ text-align: center;
154
+
155
+ }
156
+
157
+
158
+
159
+
160
+
161
+
162
+
163
+ nav{
164
+
165
+
166
+
167
+ }
168
+
169
+
170
+
171
+ nav ul{
172
+
173
+ display: flex;
174
+
175
+
176
+
177
+
178
+
179
+ }
180
+
181
+
182
+
183
+ nav ul li{
184
+
185
+ margin-left: 20px;
186
+
187
+ }
188
+
189
+
190
+
191
+ nav ul li a{
192
+
193
+ color: #555555;
194
+
195
+ text-decoration: none;
196
+
197
+ font-size: 14px;
198
+
199
+ font-weight: bold;
200
+
201
+ }
202
+
203
+
204
+
205
+ nav ul li a:hover{
206
+
207
+ color: #73b55e;
208
+
209
+ }
210
+
211
+
212
+
213
+
214
+
215
+
216
+
217
+ headerが、①②③をすべて囲んでいて、
218
+
219
+ section classのheader_01が②
220
+
221
+ navが③です。
222
+
223
+
224
+
225
+
226
+
227
+
228
+
229
+ ```