김명주

Add design element(css)

1 +div
2 +{
3 + width: 500px;
4 + height:700px;
5 + margin: 0 auto;
6 + display:block;
7 + background-color: white;
8 +}
9 +#tex1
10 +{
11 + font-family: 'Nanum Gothic';
12 + font-size:80px;
13 + font-weight: bold;
14 +}
15 +#tex2
16 +{
17 + font-family: 'Nanum Gothic';
18 + font-size:30px;
19 + font-weight: bold;
20 +}
21 +#btn
22 +{
23 + position: relative;
24 + top:40%;
25 + width:100%;
26 + height:12%;
27 + font-family: 'Nanum Gothic';
28 + font-size:large;
29 + font-weight: bold;
30 + color:white;
31 + background-color: black;
32 + text-align: center;
33 + border-radius: 12px;
34 +
35 +}
36 +.box {
37 + animation: fade-in 0.8s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
38 +}
39 +@keyframes fade-in {
40 + 0% {
41 + opacity: 0;
42 + }
43 + 100% {
44 + opacity: 1;
45 + }
46 + }
47 +
48 +@keyframes spin {
49 + 100% {
50 + transform: rotate(360deg);
51 + }
52 +}
53 +.spinner
54 +{
55 + display: inline-block;
56 + width: 50px;
57 + height: 50px;
58 + border: 5px solid black;
59 + border-color: black transparent transparent;
60 + border-radius: 50%;
61 + animation: spin 1s linear infinite;
62 +}