Add files via upload

aha-rin · Apr 14, 2024 · 687bf88 · 687bf88
commit 687bf88
Show file tree

Hide file tree

Showing 2 changed files with 154 additions and 0 deletions.
diff --git a/harin_Week1_1.html b/harin_Week1_1.html
@@ -0,0 +1,115 @@
+<!doctype html>
+<html>
+    <head>
+        <meta charset="'utf-8">
+        <title>이하린을 소개하는 웹 페이지</title>
+        <style>
+            #list{
+                color:green;
+            }
+            #pic{
+                position: relative;
+                left: 570px;
+                bottom:250px;
+                border-left:1px solid black;
+                padding-left:10px;
+            }
+            #hobby{
+                position: absolute;
+                top: 300px;
+            }
+            h3{
+                font-size:40px;
+                width:500px;
+                margin:5px;
+                color: salmon;
+                border-bottom:1px solid black;
+                border-top: 2px dotted grey;
+            }
+            table{
+                margin-left:5px;
+            }
+            a{
+                text-decoration:none;
+                color:peru;
+            }
+            @media(max-width:800px){
+                img {
+                    display:none;
+                }
+                h3{
+                font-size:40px;
+                margin:5px;
+                color: salmon;
+                text-align:center;
+            }
+            a{
+                text-decoration:none;
+                color:peru;
+            }
+            #list{
+                color:green;
+                text-align:center;
+            }
+            #pic{
+                position:static;
+            }
+            p{
+                text-align:center;
+            }
+            }
+        </style>
+    </head>
+    <body>
+    <input type="button" value="night" onclick="
+    document.querySelector('body').style.backgroundColor = 'black';
+    document.querySelector('body').style.color = 'white';">
+    <input type="button" value="day" onclick="
+    document.querySelector('body').style.backgroundColor = 'white';
+    document.querySelector('body').style.color = 'black';">
+    <div id="grid">
+            <h3 style="height:60px">인사</h3>
+            <p>안녕하세요.<br>저는 <u>부경대학교 컴퓨터인공지능공학부</u> 2학년 <strong>이하린입니다.</strong><br>
+            개발은 처음이지만 노력해서 실력을 쌓아가고 싶어요.<br>앞으로 잘 부탁드립니다.</p>
+        <div id="hobby">
+            <h3>취미</h3>
+            <p>저는 쉴 때 음악을 듣는 것을 좋아해요.<br>제가 좋아하는 음악 목록은 다음과 같습니다:</p>
+            <div id="list">
+            <table border="2px solid grey">
+                <tr>
+                    <th>가수</th>
+                    <th>제목</th>
+                </tr>
+                <tr>
+                    <td>(여자)아이들</td>
+                    <td>나는 아픈 건 딱 질색이니까</td>
+                </tr>
+                <tr>
+                    <td>Lauv</td>
+                    <td>Steal The Show</td>
+                </tr>
+                <tr>
+                    <td>요네즈 켄시</td>
+                    <td>Lemon</td>
+            </table>
+            </div>
+        <p><a href="https://www.youtube.com/">유튜브에 가면 이 노래들을 들을 수 있어요.</a></p>
+        <p>최근 새로운 취미로 수영을 시작했어요.<br>저번 달부터 배우고 있는데, 나날이 발전하는 것이 느껴져 무척 재미있습니다.</p>
+        </div>
+        <p>프론트엔드에서 어떤 것을 가장 좋아하시나요?</p>
+            <input type="radio" id="HTML" name="language" value="HTML" checked/>
+            <label for="HTML">HTML</label>   
+            <input type="radio" id="CSS" name="language" value="CSS" checked/>
+            <label for="CSS">CSS</label> 
+            <input type="radio" id="JS" name="language" value="JS" checked/>
+            <label for="JS">JS</label>     
+        <div id="pic">
+            <h3><a href="C:\Users\chika\OneDrive\문서\PKNU\gdsc_frontend\2024_1_FE_beginner\Ch01\Harin_Lee\harin_Week1_2.html">최근의 고민</a></h3>
+            <img src="https://images.unsplash.com/photo-1511871893393-82e9c16b81e3?q=80&w=870&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D">
+        </div>
+    </div> 
+    <label for="site-search">Search the site:</label>
+    <input type="search" id="site-search" name="q" onkeydown="alert('이것은 가짜 검색창입니다.')" />
+    <button>Search</button>
+    </body>
+</html>
diff --git a/harin_Week1_2.html b/harin_Week1_2.html
@@ -0,0 +1,39 @@
+<!doctype html>
+<html>
+    <head>
+        <meta charset="'utf-8">
+        <title>최근의 고민</title>
+        <style>
+            p{
+                background: lemonchiffon;
+                padding:20px;
+                margin:20px;
+                border: 5px solid cyan;
+            }
+            div{
+                width:200px;
+                background: pink;
+                padding:30px;
+                margin:30px;
+                border: 8px dotted skyblue;
+                text-align: center;
+            }
+        </style>
+    </head>
+    <body>
+        <input type="button" value="pink" onclick="
+        document.querySelector('body').style.backgroundColor = 'pink';
+        document.querySelector('body').style.color = 'navy';">
+        <input type="button" value="gray" onclick="
+        document.querySelector('body').style.backgroundColor = 'gray';
+        document.querySelector('body').style.color = 'black';">
+        <input type="text" onkeydown="alert('파이팅!')">
+        <p style="font-size:30px;"><strong>과제</strong>가 계속 생겨요...<br>
+        1학년 때는 교수님들이 친절하게 하나하나 가르쳐주셨는데 2학년이 되니 단신으로 정글에 던져진 기분입니다.<br>
+        이것이 진정한 대학생의 모습인 줄은 꿈에도 몰랐습니다.<br>
+        그래도 함께 고통받는 동기들이 있어서 즐거워요.^^</p>
+        <div>
+            <a href="C:\Users\chika\OneDrive\문서\PKNU\GDSC_FRONTEND\harin_Week1_1.html">본문으로 돌아가기</a>
+        </div>
+    </body>
+</html>