1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85
| html{ height: 100%; } body{ height: 100%; margin: 0px; background-image: url(../img/bg.jpg); background-size: cover; display: flex; align-items: center; justify-content: center; }
#left{ width: 20%; padding-top: 20px; padding-left: 20px; } #left font{ font-size: 25px; color: gray; } #left #f1{ color: orange; }
#center{ width: 60%; padding-top: 20px; display: flex; padding-top: 60px; justify-content: center; color: gray; } #center input{ width: 300px; height: 35px; border: 1px solid lightgray; border-radius: 5px; } #center #codes{ display: flex; align-items: center; } #center #code{ width: 210px; } #center #img{ padding-left: 10px; } #center button{ width: 9.375rem; height: 2.1875rem; margin-top: 20px; background-color: orange; border-radius: 5px; color: white; font-weight: bolder; } #center button:active{ background-color: #ff5500; }
#right{ width: 20%; padding-top: 20px; } #right a{ color: indianred; text-decoration: none; } #right a:hover{ color: red; }
#container{ display: flex; background-color: white; width: 62.5rem; height: 31.25rem; } img{ width: 80px; }
|