allong/index.html at master · allongsio/allong · GitHub

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
<!DOCTYPE html>
<html lang="ko">
    <head>
        <!--구글폰트-->
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Koulen&display=swap" rel="stylesheet">
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width", initial-scale="1.0">
        <title>HI! THIS IS MY FIRST WEBSITE!</title>
        <link rel="stylesheet" href="./css/introduction.css">
    </head>
    <body>
        <div class="whole">
            <header>
                <div class="logo-nav">
                    <a href="#01" class="logo">
                        <p>MY FIRST WEBSITE</p>
                    </a>
                    <ul class="main-menu">
                        <li class="item">
                            <div class="item__name"><a href="#01">HOME</a></div>
                        </li>
                        <li class="item">
                            <div class="item__name"><a href="#02">ABOUT</a></div>
                        </li>
                        <li class="item">
                            <div class="item__name"><a href="#03">CONTACT</a></div>
                        </li>
                    </ul>
                </div>
            </header>
                <section id="01" class="home-page">
                    <div class="home"><a name="home"></a>
                        <h1>Hello! I'm Jae-Hong!</h1>
                        <img id='home-photo' src="./images/home-photo.jpeg">
                        <p id="home-mention">항상 여러분과 함께 나아가는 개발자가 되겠습니다.<br>
                            반갑습니다:)</p>
                    </div>
                </section>
                <section id="02" class="about-page">
                    <div class="about"><a name="about"></a>
                        <img id="about-photo" src="./images/about-photo.jpeg">
                        <ul class="about-factor">
                            <li class="factors">Nmae : 최재홍</li>
                            <li class="factors">MBTI : ISTP</li>
                            <li class="factors">Major : Psychology</li>
                            <li class="factors">Birth Date : 1990.09.12</li>
                            <li class="factors">Wannabe : Front-End dev</li>
                        </ul>
                    </div>
                </section>
                <section id="03" class="contact-page">
                    <div class="contact"><a name="contact"></a>
                        <div>
                            <img id="instagram" src="./images/icons8-instagram-50.png">
                            <span>allong_sio</span>
                        </div>
                        <div>
                            <img id="mail" src="./images/icons8-mail-50.png">
                            <span>choisio2301@gmail.com</span>
                        </div>
                        <div>
                            <img id="phone" src="./images/icons8-phone-50.png">
                            <span>010.4545.9289</span>
                        </div>
                    </div>
                </section>
            </div>
    </body>
</html>