MyHomepage/index.html at main · mungyun/MyHomepage · 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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
<!DOCTYPE html>
<html lang="ko">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="css/style.css" />
    <link rel="stylesheet" href="css/About.css" />
    <link rel="stylesheet" href="css/Service.css" />
    <link rel="stylesheet" href="css/Contact.css" />
    <link rel="icon" href="images/logo.jpg" type="image/jpeg" size="32x32" />
    <title>Mungyun</title>
  </head>
  <body>
    <header>
      <nav>
        <h1 class="logo">
          <a class="logo-link" href="#Home">
            <img
              class="nav-img"
              src="images/logo.jpg"
              width="140"
              height="79"
            />
          </a>
        </h1>

        <ul class="nav">
          <li class="nav-element">
            <a class="nav-link" href="#Home">Home</a>
          </li>
          <li class="nav-element">
            <a class="nav-link" href="#About">About</a>
          </li>
          <li class="nav-element">
            <a class="nav-link" href="#Service">Services</a>
          </li>
          <li class="nav-element">
            <a class="nav-link" href="#Contact">Contact</a>
          </li>
        </ul>
      </nav>
    </header>

    <section class="section1" id="Home">
      <div class="container">
        <div class="sec1-container">
          <aside class="sec1-aside">
            <span class="sec1-aside-top">Frontend Developer</span>
            <h2 class="sec1-aside-mid">MunGyun Park</h2>
            <p class="sec1-aside-bot">I'm studying front-end development.</p>
          </aside>
          <img class="my-img" src="images/mungyun.jpg" />
        </div>
      </div>
    </section>

    <section id="About">
      <div class="container about-container">
        <span class="sub-title">A Few Words</span>
        <h2 class="main-title">About me</h2>
      </div>

      <section>
        <div class="container">
          <div class="sec-container">
            <div class="sec1-article">
              <h2 class="sec1-article-title">폭넓은 전문 지식</h2>
              <h3 class="sec1-article-mid">
                포괄적인 해결책을 위한 다학문적 접근법
              </h3>
              <p class="sec1-article-bot">
                수학, 경제학, 산업수학 전공과 소프트웨어 연구를 결합한 다학문적 접근법을 통해, 독특한 관점과 포괄적인 이해를 바탕으로 모든 도전에 임합니다. 이러한 다양한 교육 배경은 다양한 분야에서 균형 잡히고 혁신적인 해결책을 제시할 수 있도록 해줍니다.
              </p>
            </div>
            <div class="studyImg-box">
              <img
                src="images/study.png"
                width="100%"
              />
            </div>
          </div>
        </div>
      </section>
      <section>
        <div class="container">
          <div class="sec-container sec2-container">
            <img
              class="certificate-img"
              src="images/certificate.jpg"
              width="430"
              height="350"
            />
            <div class="sec2-article">
              <h2 class="sec1-article-title">폭넓은 자격증</h2>
              <h3 class="sec1-article-mid">
                다양한 분야의 자격증 소지
              </h3>
              <ul class="sec1-article-bot">
                <li>투자자산운용사</li>
                <li>재무위험관리사</li>
                <li>한국사 1급</li>
                <li>ADSP</li>
                <li>정보처리기사(필기)</li>
                <li>TOEIC 750</li>
                <p>이러한 자격증들은 다양한 영역에서 깊이 있는 지식과 기술적 숙련도를 보여주며, 복잡한 문제를 해결하고 혁신적인 접근 방식을 제공하는 데 기여합니다.</p>
              </ul>

            </div>
          </div>
        </div>
      </section>
    </section>

    <section id="Service">
      <div class="container service-container">
        <span class="sub-title">Services</span>
        <h2 class="main-title">What I do</h2>
      </div>
      <div class="container">
        <div class="site-container">
          <a href="https://github.com/mungyun" target="_blank" class="site-section">
            <img class='site-img' src="./images/github.png" width="70" height="70">
            <p class="site-text">제 GitHub 프로필에 오신 것을 환영합니다! 👋 <br>

            제 GitHub에서는 저의 개인 프로젝트, 오픈 소스 기여, 그리고 최신 기술 트렌드에 대한 실험들을 확인하실 수 있습니다.</p>
          </a>


          <a href="https://mungyun.tistory.com/" target="_blank" class="site-section">
            <img class='site-img' src="./images/tstory.png" width="70" height="70">
            <p class="site-text">제 Tistory에 오신 것을 환영합니다! 👋 <br>
              제 Tistory에 프론트엔드 개발에 대한 통찰을 제공하고 기술적인 문제 해결, 개발 관련 최신 트렌드, 팁과 노하우를 담고 있습니다.</p>
          </a>
      </div>
    </section>

    <section id="Contact">
      <div class="container contact-container">
        <span class="sub-title">Get in Touch</span>
        <h2 class="main-title">Contact</h2>
      </div>

      <section>
        <div class="container">
          <div class="sec-container">
            <div class="follow">
              <h2 class="sec1-article-title">Follow Me</h2>
              <a href="https://www.instagram.com/gyunn_e/"
                target="_blank"><img
                  class="follow-img"
                  src="images/instagram.jpeg"
              /></a>
              <a
                href="https://www.facebook.com/profile.php?id=100008050810732&locale=ko_KR"
                target="_blank"><img
                  class="follow-img"
                  src="images/facebook.png"
              /></a>
            </div>
            <div class="info">
              <div class="info-icon">
                <img class="info-img" src="images/phone.png" />
                <div class="phone">
                  <span class="info-title">Phone Number</span>
                  <p class="info-main">+82 01012345678</p>
                </div>
              </div>
              <div class="info-icon">
                <img class="info-img" src="images/email.png" />
                <div class="email">
                  <span class="info-title">Email</span>
                  <p class="info-main">[email protected]</p>
                </div>
              </div>
              <div class="info-icon">
                <img class="info-img" src="images/home.png" />
                <div class="home">
                  <span class="info-title">Address</span>
                  <p class="info-main">Busan, South Korea</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </section>

    <script src="style.js"></script>
  </body>
</html>