teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

コードの表示方法と範囲

2016/07/01 12:39

投稿

ishigaki16
ishigaki16

スコア10

title CHANGED
File without changes
body CHANGED
@@ -7,6 +7,16 @@
7
7
  どうぞよろしくお願いいたします。
8
8
 
9
9
  ###該当のソースコード
10
+ ``` <header class="header">
11
+ <div class="top">
12
+ <img src="img/imagebanner.png" width="1178" height="390" alt=""/>
13
+ </div>
14
+ <div class="digicatalog">
15
+ <img src="img/dicatalogbtn.png" width="334" height="70" alt=""/>
16
+ </div>
17
+ </header>
18
+ ```
19
+ ```
10
20
  @charset "UTF-8";
11
21
  /* CSS Document */
12
22
 
@@ -47,176 +57,6 @@
47
57
  top: 255px;
48
58
  left: 820px;
49
59
  }
50
-
51
- .wrapper {
52
- width: 980px;
53
- margin: 0 auto;
54
- }
55
-
56
- .main {
57
- width: 100%;
58
- display: block;
59
- margin: 0 auto;
60
- text-align:center;
61
- }
62
-
63
- .menubutton {
64
- margin-top: 50px;
65
- }
66
-
67
- .menuleft {
68
- margin-right: 5px;
69
- }
70
-
71
- .menuright {
72
- float: left;
73
- }
74
-
75
- .slides {
76
- width: 209px;
77
- height: 474px;
78
- float: left;
79
- display: block;
80
- margin-left: 10px;
81
- margin-right: 10px;
82
- }
83
-
84
- .caroufredsel_wrapper {
85
- position: relative;
86
- width: 1030px;
87
- height: 474px;
88
- margin: 0 auto;
89
- }
90
-
91
- .prev {
92
- position: absolute;
93
- top: 1160px;
94
- left: 220px;
95
- }
96
-
97
- .next {
98
- position: absolute;
99
- top: 1160px;
100
- right: 235px;
101
- }
102
-
103
-
104
- h2 .midashi2{
105
- clear: both;
106
- }
107
-
108
- .cute {
109
- width: 980px;
110
- height: 655px;
111
- background-image: url(../img/bg_cute.png);
112
- background-repeat: no-repeat;
113
- }
114
-
115
- .cute1 {
116
- padding-top: 50px;
117
- padding-right: 120px;
118
- }
119
-
120
- .cute2 {
121
- padding-top: 55px;
122
- padding-right: 115px;
123
- }
124
-
125
- .modern {
126
- width: 981px;
127
- height: 786px;
128
- background-image: url(../img/bg_modern.png);
129
- background-repeat: no-repeat;
130
- }
131
-
132
- .modern1 {
133
- padding-top: 20px;
134
- padding-right: 120px;
135
- }
136
-
137
- .modern2 {
138
- padding-top: 55px;
139
- padding-right: 115px;
140
- }
141
-
142
- .modern3 {
143
- padding-top: 5px;
144
- }
145
-
146
- .kodawari {
147
- width: 980px;
148
- height: 753px;
149
- background-image: url(../img/bg_kodawari.png);
150
- background-repeat: no-repeat;
151
- }
152
-
153
- .kodawari1 {
154
- padding-top: 30px;
155
- padding-right: 120px;
156
- }
157
-
158
- .kodawari2 {
159
- padding-top: 55px;
160
- padding-right: 115px;
161
- }
162
-
163
- .kodawari3 {
164
- padding-top: 5px;
165
- padding-left: 100px;
166
- }
167
-
168
- .shittori {
169
- width: 980px;
170
- height: 695px;
171
- margin-top: 30px;
172
- background-image: url(../img/bg_shittori.png);
173
- background-repeat: no-repeat;
174
- }
175
-
176
- .shittori1 {
177
- padding-top: 30px;
178
- padding-right: 120px;
179
- }
180
-
181
- .shittori2 {
182
- padding-top: 55px;
183
- padding-right: 115px;
184
- padding-left: 280px;
185
- }
186
-
187
- .mens {
188
- width: 980px;
189
- height: 450px;
190
- margin-bottom: 200px;
191
- background-image: url(../img/bg_mens.png);
192
- background-repeat: no-repeat;
193
- }
194
-
195
- .mens1 {
196
- padding-top: 35px;
197
- padding-right: 300px;
198
- }
199
-
200
- .mens2 {
201
- padding-top: 30px;
202
- padding-right: 125px;
203
- }
204
-
205
- .footer {
206
- width: 80%;
207
- margin: 0 auto;
208
- width: 1181px;
209
- height: 200px;
210
- margin-top: 120px;
211
- background-image: url(../img/bg_footer.png);
212
- background-repeat: no-repeat;
213
- }
214
-
215
- .footerbuttons {
216
- padding-top: 60px;
217
- padding-left: 300px;
218
- }
219
- }
220
60
 
221
61
  /* tablet */
222
62
  @media only screen and (min-width: 641px) and (max-width: 960px) {
@@ -255,176 +95,6 @@
255
95
  top: 255px;
256
96
  left: 820px;
257
97
  }
258
-
259
- .wrapper {
260
- width: 980px;
261
- margin: 0 auto;
262
- }
263
-
264
- .main {
265
- width: 100%;
266
- display: block;
267
- margin: 0 auto;
268
- text-align:center;
269
- }
270
-
271
- .menubutton {
272
- margin-top: 50px;
273
- }
274
-
275
- .menuleft {
276
- margin-right: 5px;
277
- }
278
-
279
- .menuright {
280
- float: left;
281
- }
282
-
283
- .slides {
284
- width: 209px;
285
- height: 474px;
286
- float: left;
287
- display: block;
288
- margin-left: 10px;
289
- margin-right: 10px;
290
- }
291
-
292
- .caroufredsel_wrapper {
293
- position: relative;
294
- width: 1030px;
295
- height: 474px;
296
- margin: 0 auto;
297
- }
298
-
299
- .prev {
300
- position: absolute;
301
- top: 1160px;
302
- left: 220px;
303
- }
304
-
305
- .next {
306
- position: absolute;
307
- top: 1160px;
308
- right: 235px;
309
- }
310
-
311
-
312
- h2 .midashi2{
313
- clear: both;
314
- }
315
-
316
- .cute {
317
- width: 980px;
318
- height: 655px;
319
- background-image: url(../img/bg_cute.png);
320
- background-repeat: no-repeat;
321
- }
322
-
323
- .cute1 {
324
- padding-top: 50px;
325
- padding-right: 120px;
326
- }
327
-
328
- .cute2 {
329
- padding-top: 55px;
330
- padding-right: 115px;
331
- }
332
-
333
- .modern {
334
- width: 981px;
335
- height: 786px;
336
- background-image: url(../img/bg_modern.png);
337
- background-repeat: no-repeat;
338
- }
339
-
340
- .modern1 {
341
- padding-top: 20px;
342
- padding-right: 120px;
343
- }
344
-
345
- .modern2 {
346
- padding-top: 55px;
347
- padding-right: 115px;
348
- }
349
-
350
- .modern3 {
351
- padding-top: 5px;
352
- }
353
-
354
- .kodawari {
355
- width: 980px;
356
- height: 753px;
357
- background-image: url(../img/bg_kodawari.png);
358
- background-repeat: no-repeat;
359
- }
360
-
361
- .kodawari1 {
362
- padding-top: 30px;
363
- padding-right: 120px;
364
- }
365
-
366
- .kodawari2 {
367
- padding-top: 55px;
368
- padding-right: 115px;
369
- }
370
-
371
- .kodawari3 {
372
- padding-top: 5px;
373
- padding-left: 100px;
374
- }
375
-
376
- .shittori {
377
- width: 980px;
378
- height: 695px;
379
- margin-top: 30px;
380
- background-image: url(../img/bg_shittori.png);
381
- background-repeat: no-repeat;
382
- }
383
-
384
- .shittori1 {
385
- padding-top: 30px;
386
- padding-right: 120px;
387
- }
388
-
389
- .shittori2 {
390
- padding-top: 55px;
391
- padding-right: 115px;
392
- padding-left: 280px;
393
- }
394
-
395
- .mens {
396
- width: 980px;
397
- height: 450px;
398
- margin-bottom: 200px;
399
- background-image: url(../img/bg_mens.png);
400
- background-repeat: no-repeat;
401
- }
402
-
403
- .mens1 {
404
- padding-top: 35px;
405
- padding-right: 300px;
406
- }
407
-
408
- .mens2 {
409
- padding-top: 30px;
410
- padding-right: 125px;
411
- }
412
-
413
- .footer {
414
- width: 80%;
415
- margin: 0 auto;
416
- width: 1181px;
417
- height: 200px;
418
- margin-top: 120px;
419
- background-image: url(../img/bg_footer.png);
420
- background-repeat: no-repeat;
421
- }
422
-
423
- .footerbuttons {
424
- padding-top: 60px;
425
- padding-left: 300px;
426
- }
427
- }
428
98
 
429
99
  /* smartPhone */
430
100
  @media screen and (max-width: 640px) {
@@ -463,173 +133,4 @@
463
133
  top: 255px;
464
134
  left: 820px;
465
135
  }
466
-
467
- .wrapper {
468
- width: 980px;
469
- margin: 0 auto;
470
- }
471
-
472
- .main {
136
+ ```
473
- width: 100%;
474
- display: block;
475
- margin: 0 auto;
476
- text-align:center;
477
- }
478
-
479
- .menubutton {
480
- margin-top: 50px;
481
- }
482
-
483
- .menuleft {
484
- margin-right: 5px;
485
- }
486
-
487
- .menuright {
488
- float: left;
489
- }
490
-
491
- .slides {
492
- width: 209px;
493
- height: 474px;
494
- float: left;
495
- display: block;
496
- margin-left: 10px;
497
- margin-right: 10px;
498
- }
499
-
500
- .caroufredsel_wrapper {
501
- position: relative;
502
- width: 1030px;
503
- height: 474px;
504
- margin: 0 auto;
505
- }
506
-
507
- .prev {
508
- position: absolute;
509
- top: 1160px;
510
- left: 220px;
511
- }
512
-
513
- .next {
514
- position: absolute;
515
- top: 1160px;
516
- right: 235px;
517
- }
518
-
519
-
520
- h2 .midashi2{
521
- clear: both;
522
- }
523
-
524
- .cute {
525
- width: 980px;
526
- height: 655px;
527
- background-image: url(../img/bg_cute.png);
528
- background-repeat: no-repeat;
529
- }
530
-
531
- .cute1 {
532
- padding-top: 50px;
533
- padding-right: 120px;
534
- }
535
-
536
- .cute2 {
537
- padding-top: 55px;
538
- padding-right: 115px;
539
- }
540
-
541
- .modern {
542
- width: 981px;
543
- height: 786px;
544
- background-image: url(../img/bg_modern.png);
545
- background-repeat: no-repeat;
546
- }
547
-
548
- .modern1 {
549
- padding-top: 20px;
550
- padding-right: 120px;
551
- }
552
-
553
- .modern2 {
554
- padding-top: 55px;
555
- padding-right: 115px;
556
- }
557
-
558
- .modern3 {
559
- padding-top: 5px;
560
- }
561
-
562
- .kodawari {
563
- width: 980px;
564
- height: 753px;
565
- background-image: url(../img/bg_kodawari.png);
566
- background-repeat: no-repeat;
567
- }
568
-
569
- .kodawari1 {
570
- padding-top: 30px;
571
- padding-right: 120px;
572
- }
573
-
574
- .kodawari2 {
575
- padding-top: 55px;
576
- padding-right: 115px;
577
- }
578
-
579
- .kodawari3 {
580
- padding-top: 5px;
581
- padding-left: 100px;
582
- }
583
-
584
- .shittori {
585
- width: 980px;
586
- height: 695px;
587
- margin-top: 30px;
588
- background-image: url(../img/bg_shittori.png);
589
- background-repeat: no-repeat;
590
- }
591
-
592
- .shittori1 {
593
- padding-top: 30px;
594
- padding-right: 120px;
595
- }
596
-
597
- .shittori2 {
598
- padding-top: 55px;
599
- padding-right: 115px;
600
- padding-left: 280px;
601
- }
602
-
603
- .mens {
604
- width: 980px;
605
- height: 450px;
606
- margin-bottom: 200px;
607
- background-image: url(../img/bg_mens.png);
608
- background-repeat: no-repeat;
609
- }
610
-
611
- .mens1 {
612
- padding-top: 35px;
613
- padding-right: 300px;
614
- }
615
-
616
- .mens2 {
617
- padding-top: 30px;
618
- padding-right: 125px;
619
- }
620
-
621
- .footer {
622
- width: 80%;
623
- margin: 0 auto;
624
- width: 1181px;
625
- height: 200px;
626
- margin-top: 120px;
627
- background-image: url(../img/bg_footer.png);
628
- background-repeat: no-repeat;
629
- }
630
-
631
- .footerbuttons {
632
- padding-top: 60px;
633
- padding-left: 300px;
634
- }
635
- }