質問編集履歴

1

css載せました!

2019/09/02 05:34

投稿

yyymmm
yyymmm

スコア30

test CHANGED
File without changes
test CHANGED
@@ -125,3 +125,737 @@
125
125
 
126
126
 
127
127
  ```
128
+
129
+
130
+
131
+
132
+
133
+ css
134
+
135
+
136
+
137
+ ```/* ------------------------------ base css ↓↓ */
138
+
139
+ * {
140
+
141
+ margin: 0;
142
+
143
+ padding: 0;
144
+
145
+ }
146
+
147
+
148
+
149
+ body {
150
+
151
+ font-family: 'Lato', sans-serif;
152
+
153
+ font-size: 14px;
154
+
155
+ color: #595758;
156
+
157
+ background-color: #f2f2f2;
158
+
159
+ }
160
+
161
+
162
+
163
+ .clearfix:after {
164
+
165
+ content: ".";
166
+
167
+ display: block;
168
+
169
+ height: 0;
170
+
171
+ clear: both;
172
+
173
+ visibility: hidden;
174
+
175
+ }
176
+
177
+
178
+
179
+ header {
180
+
181
+ background-color: white;
182
+
183
+ border-top: 3px solid #B19956;
184
+
185
+ }
186
+
187
+
188
+
189
+ h1, h2 {
190
+
191
+ width: 900px;
192
+
193
+ margin: 0 auto;
194
+
195
+ }
196
+
197
+
198
+
199
+ h1 a {
200
+
201
+ color: #555;
202
+
203
+ text-decoration: none;
204
+
205
+ font-size: 28px;
206
+
207
+ font-weight: 900;
208
+
209
+ display: block;
210
+
211
+ margin: 20px 0 0 0;
212
+
213
+ }
214
+
215
+ h1 a:hover {
216
+
217
+ color: #333;
218
+
219
+ }
220
+
221
+
222
+
223
+ h2 {
224
+
225
+ color: #555;
226
+
227
+ font-size: 16px;
228
+
229
+ padding: 10px 0 0 0;
230
+
231
+ font-weight: 100;
232
+
233
+ }
234
+
235
+
236
+
237
+ nav {
238
+
239
+ background-color: #EBEBE7;
240
+
241
+ margin: 30px 0 0 0;
242
+
243
+ }
244
+
245
+ nav ul {
246
+
247
+ width: 900px;
248
+
249
+ margin: 0 auto;
250
+
251
+ }
252
+
253
+ nav ul li {
254
+
255
+ list-style: none;
256
+
257
+ display: inline-block;
258
+
259
+ }
260
+
261
+ nav ul li a {
262
+
263
+ font-size: 12px;
264
+
265
+ text-decoration: none;
266
+
267
+ margin: 0 30px 0 0;
268
+
269
+ display: block;
270
+
271
+ padding: 20px 0;
272
+
273
+ font-weight: 900;
274
+
275
+ color: #444;
276
+
277
+ }
278
+
279
+ nav ul li a:hover {
280
+
281
+ color: #B19956;
282
+
283
+ }
284
+
285
+
286
+
287
+
288
+
289
+ div p {
290
+
291
+ text-align: center;
292
+
293
+ padding: 30px 0;
294
+
295
+ background-color: #FFFFFF;
296
+
297
+ }
298
+
299
+
300
+
301
+
302
+
303
+ div h3 {
304
+
305
+ text-align: center;
306
+
307
+ margin: 45px 0 30px 0;
308
+
309
+ padding: 0 20px;
310
+
311
+ font-size: 30px;
312
+
313
+ }
314
+
315
+
316
+
317
+
318
+
319
+ div ul {
320
+
321
+ max-width: 900px;
322
+
323
+ margin: 0 auto 50px auto;
324
+
325
+ list-style: none;
326
+
327
+ }
328
+
329
+ div ul li {
330
+
331
+ width: 240px;
332
+
333
+ padding: 30px 15px;
334
+
335
+ margin: 10px;
336
+
337
+ display: inline-block;
338
+
339
+ background-color: #fff;
340
+
341
+ border: 1px solid #EDE6DC;
342
+
343
+ text-align: center;
344
+
345
+ font-weight: 900;
346
+
347
+ font-size: 20px;
348
+
349
+ }
350
+
351
+ div ul li a {
352
+
353
+ text-decoration: none;
354
+
355
+ color: #444;
356
+
357
+ line-height: 45px;
358
+
359
+ display: block;
360
+
361
+ }
362
+
363
+ div ul li a:hover {
364
+
365
+ color: #B19956;
366
+
367
+ }
368
+
369
+
370
+
371
+
372
+
373
+
374
+
375
+
376
+
377
+
378
+
379
+
380
+
381
+ footer {
382
+
383
+ clear: both;
384
+
385
+ text-align: center;
386
+
387
+ background-color: #2D2D2D;
388
+
389
+ color: #fff;
390
+
391
+ padding: 30px 0;
392
+
393
+ font-size: 12px;
394
+
395
+ }
396
+
397
+
398
+
399
+ input#yes {
400
+
401
+ width: 20px;
402
+
403
+ }
404
+
405
+
406
+
407
+
408
+
409
+
410
+
411
+
412
+
413
+
414
+
415
+
416
+
417
+
418
+
419
+
420
+
421
+
422
+
423
+
424
+
425
+
426
+
427
+ /* ==================
428
+
429
+ Aboutページ用css
430
+
431
+ ================== */
432
+
433
+
434
+
435
+ div section {
436
+
437
+ margin: 50px auto;
438
+
439
+ width: 900px;
440
+
441
+ }
442
+
443
+ div section h1,
444
+
445
+ table caption {
446
+
447
+ font-size: 14px;
448
+
449
+ border-left: 3px solid #B19956;
450
+
451
+ line-height: 1;
452
+
453
+ padding: 0 0 0 10px;
454
+
455
+ margin: 0 0 20px 0;
456
+
457
+ text-align: left;
458
+
459
+ font-weight: 900;
460
+
461
+ }
462
+
463
+ div section img {
464
+
465
+ width: 400px;
466
+
467
+ display: block;
468
+
469
+ margin: 0 20px 0 0;
470
+
471
+ float: left;
472
+
473
+ }
474
+
475
+ div section header {
476
+
477
+ display: block;
478
+
479
+ width: 430px;
480
+
481
+ padding: 20px;
482
+
483
+ float: right;
484
+
485
+ }
486
+
487
+ div section header h2 {
488
+
489
+ width: 400px;
490
+
491
+ margin: 0 0 20px 0;
492
+
493
+ padding: 0;
494
+
495
+ font-size: 16px;
496
+
497
+ font-weight: 900;
498
+
499
+ }
500
+
501
+ div section header p {
502
+
503
+ widows: 400px;
504
+
505
+ font-size: 12px;
506
+
507
+ text-align: left;
508
+
509
+ padding: 0;
510
+
511
+ line-height: 18px;
512
+
513
+ }
514
+
515
+
516
+
517
+
518
+
519
+
520
+
521
+
522
+
523
+
524
+
525
+
526
+
527
+ /* ==================
528
+
529
+ Aboutページーーテーブル用css
530
+
531
+ ================== */
532
+
533
+ #skill {
534
+
535
+ clear: both;
536
+
537
+ width: 900px;
538
+
539
+ margin: 0px auto;
540
+
541
+ padding: 30px 0;
542
+
543
+ }
544
+
545
+
546
+
547
+
548
+
549
+ table {
550
+
551
+ text-align: left;
552
+
553
+ width: 900px;
554
+
555
+ margin: 30px auto;
556
+
557
+ }
558
+
559
+ table tr {
560
+
561
+ font-size: 13px;
562
+
563
+ }
564
+
565
+ tbody {
566
+
567
+ background-color: #fff;
568
+
569
+ margin: 0;
570
+
571
+ }
572
+
573
+ thead {
574
+
575
+ background-color: #2D2D2D;
576
+
577
+ color: #fff!important;
578
+
579
+ margin: 0;
580
+
581
+ }
582
+
583
+ thead tr th {
584
+
585
+ background-color: #2D2D2D;
586
+
587
+ color: #fff!important;
588
+
589
+ font-size: 15px;
590
+
591
+ padding: 5px;
592
+
593
+ margin: 0;
594
+
595
+ }
596
+
597
+ table tr th {
598
+
599
+ padding: 5px;
600
+
601
+ }
602
+
603
+ table tr td {
604
+
605
+ padding: 5px;
606
+
607
+ color: #666666;
608
+
609
+ }
610
+
611
+
612
+
613
+ table tr:nth-child(2n) {
614
+
615
+ background-color: #E2E1DE;
616
+
617
+ }
618
+
619
+
620
+
621
+ tfoot tr td {
622
+
623
+ text-decoration: underline;
624
+
625
+ font-size: 12px;
626
+
627
+ font-style: italic;
628
+
629
+ color: #b8b8b8;
630
+
631
+ padding: 0;
632
+
633
+ }
634
+
635
+
636
+
637
+
638
+
639
+
640
+
641
+
642
+
643
+
644
+
645
+
646
+
647
+
648
+
649
+
650
+
651
+
652
+
653
+
654
+
655
+
656
+
657
+
658
+
659
+
660
+
661
+
662
+
663
+
664
+
665
+
666
+
667
+ /* ==================
668
+
669
+ Contactページ用css
670
+
671
+ ================== */
672
+
673
+
674
+
675
+
676
+
677
+
678
+
679
+ form {
680
+
681
+ width: 900px;
682
+
683
+ background-color: #fff;
684
+
685
+ padding: 30px;
686
+
687
+ margin: 30px auto 60px;
688
+
689
+ }
690
+
691
+
692
+
693
+ legend {
694
+
695
+ font-size: 22px;
696
+
697
+ font-weight: 900;
698
+
699
+ margin: 0 0 15px 0;
700
+
701
+ color: #B19956;
702
+
703
+ }
704
+
705
+
706
+
707
+ label {
708
+
709
+ display: block;
710
+
711
+ text-align: left;
712
+
713
+ font-size: 16px;
714
+
715
+ font-weight: 900;
716
+
717
+ margin: 0 0 5px 0;
718
+
719
+ }
720
+
721
+
722
+
723
+ form input, form textarea,select {
724
+
725
+ padding: 10px;
726
+
727
+ margin: 2px 0 20px;
728
+
729
+ border: 1px solid #EBEBE7;
730
+
731
+ width: 880px;
732
+
733
+ font-size: 13px;
734
+
735
+ }
736
+
737
+
738
+
739
+ #personal,#corporation,#varify {
740
+
741
+ float: left;
742
+
743
+ width: 20px;
744
+
745
+ height: 15px;
746
+
747
+ margin: 0 0 5px 0;
748
+
749
+ }
750
+
751
+ .left {
752
+
753
+ float: left;
754
+
755
+ height: 20px;
756
+
757
+ line-height: 1.3;
758
+
759
+ font-size: 13px;
760
+
761
+ font-weight: 100;
762
+
763
+ margin: 0 15px 0 0;
764
+
765
+ }
766
+
767
+
768
+
769
+ select {
770
+
771
+ width: 100%;
772
+
773
+ }
774
+
775
+
776
+
777
+ fieldset {
778
+
779
+ margin: 0 0 30px 0;
780
+
781
+ border: 0;
782
+
783
+ border-bottom: 1px solid #ebebe7;
784
+
785
+ padding: 0 0 30px 0;
786
+
787
+ }
788
+
789
+
790
+
791
+ optgroup {
792
+
793
+ color: #b4b4b4;
794
+
795
+ }
796
+
797
+ select option {
798
+
799
+ margin: 0 0 0 15px;
800
+
801
+ color: #000;
802
+
803
+ }
804
+
805
+
806
+
807
+ button {
808
+
809
+ background-color: #B19956;
810
+
811
+ color: #fff;
812
+
813
+ border: none;
814
+
815
+ width: 400px;
816
+
817
+ padding: 10px 0;
818
+
819
+ margin: 0 0 20px 0;
820
+
821
+ border-radius: 6px;
822
+
823
+ font-weight: 900;
824
+
825
+ display: block;
826
+
827
+ margin: 0 auto 20px auto;
828
+
829
+ }
830
+
831
+ #reset {
832
+
833
+ background-color: #EBEBE7;
834
+
835
+ color: #555;
836
+
837
+ }
838
+
839
+ button:hover {
840
+
841
+ cursor: pointer;
842
+
843
+ opacity: 0.8;
844
+
845
+ }
846
+
847
+
848
+
849
+
850
+
851
+
852
+
853
+
854
+
855
+
856
+
857
+
858
+
859
+ コード
860
+
861
+ ```