강희주 / Music_Recommendation_Website

Go to a project
Toggle navigation Toggle navigation pinning
진재영
e6232a9b 1 parent f11e745a

css files replaced

Inline Side-by-side
Showing 10 changed files with 0 additions and 500 deletions
1 -#container {
2 - width:600px;
3 - margin:10px auto;
4 - }
5 - fieldset {
6 - margin-bottom: 20px;
7 - }
8 - ul {
9 - list-style: none;
10 - padding-left: 0;
11 - }
12 - ul li {
13 - margin:10px;
14 - }
15 -
16 - .register {width: 200%;}
17 -
18 - .login {width: 200%;}
19 -
20 - /* label 텍스트 스타일 */
21 - li label {
22 - width:120px;
23 - line-height: 36px;
24 - float:left;
25 - font-weight:bold;
26 - }
27 -
28 - /* 텍스트 필드 스타일 */
29 - input[type="text"], input[type="password"], input[type="email"] {
30 - width:300px;
31 - height:30px;
32 - }
33 -
34 - /* 버튼 스타일 */
35 - #buttons {
36 - width: 800px;
37 - margin:400px auto;
38 - text-align: center;
39 - }
40 - #buttons input {
41 - width: 500px;
42 - height:100px;
43 - font-size:20px;
44 - }
45 - #buttons input:hover {
46 - background-color:rgb(27, 134, 221);
47 - color:#fff;
48 - border-color:#fff;
49 - }
50 -
51 - /* 드롭다운 메뉴 스타일 */
52 - select {
53 - width:100px;
54 - height:30px;
55 - }
...\ No newline at end of file ...\ No newline at end of file
1 -<!DOCTYPE html>
2 -<html lang="ko">
3 - <head>
4 - <script src="main.js"> </script>
5 - <meta charset="UTF-8">
6 - <title>최초 창</title>
7 - <style>
8 - #container {
9 - width:600px;
10 - margin:10px auto;
11 - }
12 - </style>
13 - <link rel="stylesheet" href="first.css">
14 - </head>
15 - <body>
16 - <div id="container">
17 - <h1>'프로그램명'을 방문해주셔서 감사합니다.</h1>
18 -
19 - <input type="button" value="register">
20 - <input type="button" value="login">
21 -
22 - <footer>
23 - <div>
24 - <p><b>developed by 강희주, 진재영, 김재욱</b></p>
25 - <address>Contact for more information. 010-2400-6771</address>
26 - <img style="width: 30%; height: 30%; float: right;" src="https://blog.kakaocdn.net/dn/bjsDsi/btqxXJM3JKe/WAK7xHbOm7kxyVqRIvoOaK/img.jpg" alt="경희대 마크">
27 - </div>
28 - </footer>
29 -
30 - </div>
31 - </body>
32 -</html>
...\ No newline at end of file ...\ No newline at end of file
1 -#container {
2 - width:600px;
3 - margin:10px auto;
4 - }
5 - fieldset {
6 - margin-bottom: 20px;
7 - }
8 - ul {
9 - list-style: none;
10 - padding-left: 0;
11 - }
12 - ul li {
13 - margin:10px;
14 - }
15 -
16 - .register {width: 200%;}
17 -
18 - .login {width: 200%;}
19 -
20 - /* label 텍스트 스타일 */
21 - li label {
22 - width:120px;
23 - line-height: 36px;
24 - float:left;
25 - font-weight:bold;
26 - }
27 -
28 - /* 텍스트 필드 스타일 */
29 - input[type="text"], input[type="password"], input[type="email"] {
30 - width:300px;
31 - height:30px;
32 - }
33 -
34 - /* 버튼 스타일 */
35 - #buttons {
36 - width: 800px;
37 - margin:400px auto;
38 - text-align: center;
39 - }
40 - #buttons input {
41 - width: 500px;
42 - height:100px;
43 - font-size:20px;
44 - }
45 - #buttons input:hover {
46 - background-color:rgb(27, 134, 221);
47 - color:#fff;
48 - border-color:#fff;
49 - }
50 -
51 - /* 드롭다운 메뉴 스타일 */
52 - select {
53 - width:100px;
54 - height:30px;
55 - }
...\ No newline at end of file ...\ No newline at end of file
1 -<!DOCTYPE html>
2 -<html lang="ko">
3 - <head>
4 - <script src="main.js"> </script>
5 - <meta charset="UTF-8">
6 - <title>최초 창</title>
7 - <style>
8 - #container {
9 - width:600px;
10 - margin:10px auto;
11 - }
12 - </style>
13 - <link rel="stylesheet" href="first.css">
14 - </head>
15 - <body>
16 - <div id="container">
17 - <h1>'프로그램명'을 방문해주셔서 감사합니다.</h1>
18 -
19 - <input type="button" value="register">
20 - <input type="button" value="login">
21 -
22 - <footer>
23 - <div>
24 - <p><b>developed by 강희주, 진재영, 김재욱</b></p>
25 - <address>Contact for more information. 010-2400-6771</address>
26 - <img style="width: 30%; height: 30%; float: right;" src="https://blog.kakaocdn.net/dn/bjsDsi/btqxXJM3JKe/WAK7xHbOm7kxyVqRIvoOaK/img.jpg" alt="경희대 마크">
27 - </div>
28 - </footer>
29 -
30 - </div>
31 - </body>
32 -</html>
...\ No newline at end of file ...\ No newline at end of file
1 -<!DOCTYPE html>
2 -<html lang="ko">
3 - <head>
4 - <script src="main.js"> </script>
5 - <meta charset="UTF-8">
6 - <title>로그인</title>
7 - <style>
8 - #container {
9 - width:600px;
10 - margin:10px auto;
11 - }
12 - </style>
13 - <link rel="stylesheet" href="register.css">
14 - </head>
15 - <body>
16 - <div id="container">
17 - <h1>'프로그램명'을 방문해주셔서 감사합니다.</h1>
18 - <form>
19 - <fieldset>
20 - <legend>로그인</legend>
21 - <ul>
22 - <li>
23 - <label for="umail">아이디(이메일)</label>
24 - <input type="email" id="umail" required>
25 - </li>
26 - <li>
27 - <label for="pwd1">비밀번호</label>
28 - <input type="password" id="pwd1" placeholder="문자와 숫자, 특수 기호 포함" required>
29 - </li>
30 - </ul>
31 - </fieldset>
32 -
33 - <div id="buttons">
34 - <input type="submit" value="로그인">
35 - <input type="reset" value="취소">
36 - </div>
37 - </form>
38 - <br>
39 - <br>
40 - <br>
41 - <!-- 공간확보 -->
42 -
43 - <footer>
44 - <div>
45 - <p><b>developed by 강희주, 진재영, 김재욱</b></p>
46 - <address>Contact for more information. 010-2400-6771</address>
47 - <img style="width: 30%; height: 30%; float: right;" src="https://blog.kakaocdn.net/dn/bjsDsi/btqxXJM3JKe/WAK7xHbOm7kxyVqRIvoOaK/img.jpg" alt="경희대 마크">
48 - </div>
49 - </footer>
50 -
51 - </div>
52 - </body>
53 -</html>
...\ No newline at end of file ...\ No newline at end of file
1 -#container {
2 - width:600px;
3 - margin:10px auto;
4 - }
5 - fieldset {
6 - margin-bottom: 20px;
7 - }
8 - ul {
9 - list-style: none;
10 - padding-left: 0;
11 - }
12 - ul li {
13 - margin:10px;
14 - }
15 -
16 - /* label 텍스트 스타일 */
17 - li label {
18 - width:120px;
19 - line-height: 36px;
20 - float:left;
21 - font-weight:bold;
22 - }
23 -
24 - /* 텍스트 필드 스타일 */
25 - input[type="text"], input[type="password"], input[type="email"] {
26 - width:300px;
27 - height:30px;
28 - }
29 -
30 - /* 버튼 스타일 */
31 - #buttons {
32 - width:400px;
33 - margin:20px auto;
34 - text-align: center;
35 - }
36 - #buttons input {
37 - width:150px;
38 - height:50px;
39 - font-size:20px;
40 - }
41 - #buttons input:hover {
42 - background-color:rgb(27, 134, 221);
43 - color:#fff;
44 - border-color:#fff;
45 - }
46 -
47 - /* 드롭다운 메뉴 스타일 */
48 - select {
49 - width:100px;
50 - height:30px;
51 - }
...\ No newline at end of file ...\ No newline at end of file
1 -<!DOCTYPE html>
2 -<html lang="ko">
3 - <head>
4 - <script src="main.js"> </script>
5 - <meta charset="UTF-8">
6 - <title>날씨에 따른 음악 추천 사이트</title>
7 - <style>
8 - #container {
9 - width:600px;
10 - margin:10px auto;
11 - }
12 - </style>
13 - <link rel="stylesheet" href="register.css">
14 - </head>
15 - <body>
16 - <div id="container">
17 - <h1>'프로그램명'을 방문해주셔서 감사합니다.</h1>
18 -
19 - <fieldset>
20 - <legend>현재 시각 정보</legend>
21 - <div><input type="button" value="현재 시간 새로고침"></div><br>
22 - </fieldset>
23 -
24 - <fieldset>
25 - <legend>현재 내 위치 정보</legend>
26 - <div><input type="button" value="현재 내 위치 검색"></div><br><!-- 검색 버튼 누르면 팝업으로 위치 서비스 동의 버튼 뜨게 하기 -->
27 - </fieldset>
28 -
29 - <fieldset>
30 - <legend>추천 음악 정보</legend>
31 - <div><input type="button" value="음악 추천 받기"></div><br>
32 -
33 - <h4>첫 번째 음악 재생</h4>
34 - <div>playlist</div>
35 - <iframe width="942" height="530" src="https://www.youtube.com/embed/vnS_jn2uibs" title="YouTube video player" frameborder="0"
36 - allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
37 - <!-- 위에는 예시 영상임(데이식스-한 페이지가 될 수 있게). 나중에 자동으로 영상 키를 받아올 수 있도록 구현해야 할 듯.
38 - 참고로 영상 키는 위 링크 중 embed 다음에 오는 "vnS_jn2uibs"에 해당. -->
39 - </fieldset>
40 -
41 -
42 - <br>
43 - <br>
44 - <br>
45 - <br>
46 - <br>
47 - <br>
48 - <br>
49 - <br>
50 - <br>
51 - <!-- 공간확보 -->
52 -
53 - <footer>
54 - <div>
55 - <p><b>developed by 강희주, 진재영, 김재욱</b></p>
56 - <address>Contact for more information. 010-2400-6771</address>
57 - <img style="width: 30%; height: 30%; float: right;" src="https://blog.kakaocdn.net/dn/bjsDsi/btqxXJM3JKe/WAK7xHbOm7kxyVqRIvoOaK/img.jpg" alt="경희대 마크">
58 - </div>
59 - </footer>
60 -
61 - </div>
62 - </body>
63 -</html>
...\ No newline at end of file ...\ No newline at end of file
1 -#container {
2 - width:600px;
3 - margin:10px auto;
4 - }
5 - fieldset {
6 - margin-bottom: 20px;
7 - }
8 - ul {
9 - list-style: none;
10 - padding-left: 0;
11 - }
12 - ul li {
13 - margin:10px;
14 - }
15 -
16 - /* label 텍스트 스타일 */
17 - li label {
18 - width:120px;
19 - line-height: 36px;
20 - float:left;
21 - font-weight:bold;
22 - }
23 -
24 - /* 텍스트 필드 스타일 */
25 - input[type="text"], input[type="password"], input[type="email"] {
26 - width:300px;
27 - height:30px;
28 - }
29 -
30 - /* 버튼 스타일 */
31 - #buttons {
32 - width:400px;
33 - margin:20px auto;
34 - text-align: center;
35 - }
36 - #buttons input {
37 - width:150px;
38 - height:50px;
39 - font-size:20px;
40 - }
41 - #buttons input:hover {
42 - background-color:rgb(27, 134, 221);
43 - color:#fff;
44 - border-color:#fff;
45 - }
46 -
47 - /* 드롭다운 메뉴 스타일 */
48 - select {
49 - width:100px;
50 - height:30px;
51 - }
...\ No newline at end of file ...\ No newline at end of file
1 -#container {
2 - width:600px;
3 - margin:10px auto;
4 - }
5 - fieldset {
6 - margin-bottom: 20px;
7 - }
8 - ul {
9 - list-style: none;
10 - padding-left: 0;
11 - }
12 - ul li {
13 - margin:10px;
14 - }
15 -
16 - /* label 텍스트 스타일 */
17 - li label {
18 - width:120px;
19 - line-height: 36px;
20 - float:left;
21 - font-weight:bold;
22 - }
23 -
24 - /* 텍스트 필드 스타일 */
25 - input[type="text"], input[type="password"], input[type="email"] {
26 - width:300px;
27 - height:30px;
28 - }
29 -
30 - /* 버튼 스타일 */
31 - #buttons {
32 - width:400px;
33 - margin:20px auto;
34 - text-align: center;
35 - }
36 - #buttons input {
37 - width:150px;
38 - height:50px;
39 - font-size:20px;
40 - }
41 - #buttons input:hover {
42 - background-color:rgb(27, 134, 221);
43 - color:#fff;
44 - border-color:#fff;
45 - }
46 -
47 - /* 드롭다운 메뉴 스타일 */
48 - select {
49 - width:100px;
50 - height:30px;
51 - }
...\ No newline at end of file ...\ No newline at end of file
1 -<!DOCTYPE html>
2 -<html lang="ko">
3 - <head>
4 - <script src="main.js"> </script>
5 - <meta charset="UTF-8">
6 - <title>회원 가입</title>
7 - <style>
8 - #container {
9 - width:600px;
10 - margin:10px auto;
11 - }
12 - </style>
13 - <link rel="stylesheet" href="register2.css">
14 - </head>
15 - <body>
16 - <div id="container">
17 - <h1>'프로그램명'을 방문해주셔서 감사합니다.</h1>
18 - <form>
19 - <fieldset>
20 - <legend>사용자 정보</legend>
21 - <ul>
22 - <li>
23 - <label for="umail">아이디(이메일)</label>
24 - <input type="email" id="umail" required>
25 - </li>
26 - <li>
27 - <label for="pwd1">비밀번호</label>
28 - <input type="password" id="pwd1" placeholder="문자와 숫자, 특수 기호 포함" required>
29 - </li>
30 - <li>
31 - <label for="pw2">비밀번호 확인</label>
32 - <input type="password" id="pwd2" required>
33 - </li>
34 - </ul>
35 - </fieldset>
36 -
37 - <div id="buttons">
38 - <input type="submit" value="가입하기">
39 - <input type="reset" value="취소">
40 - </div>
41 - </form>
42 - <br>
43 - <br>
44 - <br>
45 - <!-- 공간확보 -->
46 -
47 - <footer>
48 - <div>
49 - <p><b>developed by 강희주, 진재영, 김재욱</b></p>
50 - <address>Contact for more information. 010-2400-6771</address>
51 - <img style="width: 30%; height: 30%; float: right;" src="https://blog.kakaocdn.net/dn/bjsDsi/btqxXJM3JKe/WAK7xHbOm7kxyVqRIvoOaK/img.jpg" alt="경희대 마크">
52 - </div>
53 - </footer>
54 -
55 - </div>
56 - </body>
57 -</html>
...\ No newline at end of file ...\ No newline at end of file