Showing
13 changed files
with
90 additions
and
16 deletions
html/BMDOHYEON_ttf.ttf
0 → 100644
No preview for this file type
html/khu.PNG
0 → 100644
6.36 KB
html/searchicon.png
0 → 100644
653 Bytes
html/검색화면.html
0 → 100644
1 | +<!DOCTYPE html> | ||
2 | +<html> | ||
3 | +<head> | ||
4 | + <title>대여화면3</title> | ||
5 | +</head> | ||
6 | +<style> | ||
7 | +body { | ||
8 | + background-color: rgb(230, 243, 255); | ||
9 | +} | ||
10 | +img { | ||
11 | + display:block; | ||
12 | + margin:auto; | ||
13 | +} | ||
14 | +input[type=text] { | ||
15 | + width: 300px; | ||
16 | + box-sizing: border-box; | ||
17 | + border: 3px solid rgb(191, 191, 191); | ||
18 | + border-radius: 4px; | ||
19 | + font-size: 18px; | ||
20 | + font-family: '배달의민족 도현'; | ||
21 | + background-color: rgb(230, 243, 255); | ||
22 | + background-position: 5px 2.5px; | ||
23 | + background-repeat: no-repeat; | ||
24 | + padding: 12px 20px 12px 50px; | ||
25 | + -webkit-transition: width 0.4s ease-in-out; | ||
26 | + transition: width 0.4s ease-in-out; | ||
27 | +} | ||
28 | +input[type=text]:focus { | ||
29 | + width: 30%; | ||
30 | +} | ||
31 | +#btn1 { | ||
32 | + width: 147px; | ||
33 | + height: 60px; | ||
34 | + font-size:16px; | ||
35 | + font-family: '배달의민족 도현'; | ||
36 | + text-align: left; | ||
37 | + color: gray; | ||
38 | + background: white; | ||
39 | + border: solid 5px white; | ||
40 | + border-radius: 5px; | ||
41 | +} | ||
42 | +#btn2 { | ||
43 | + width: 147px; | ||
44 | + height: 60px; | ||
45 | + font-size:25px; | ||
46 | + font-family: '배달의민족 도현'; | ||
47 | + color: rgb(045, 098, 155); | ||
48 | + background: white; | ||
49 | + border: solid 5px white; | ||
50 | + border-radius: 5px; | ||
51 | +} | ||
52 | + | ||
53 | +</style> | ||
54 | + | ||
55 | +<body> | ||
56 | + | ||
57 | +<br> | ||
58 | +<img style="border-radius:15px;" width="300px;" src="캡처7.png"/> | ||
59 | +<form> | ||
60 | + | ||
61 | +<br> | ||
62 | + | ||
63 | +<center><input style="background-image:url(searchicon.png);" type="text" name="search" placeholder="Search.."></center><br> | ||
64 | +<center><button id="btn1">전자정보대학<br>103호</button> <button id="btn2">대여가능</button></center><br> | ||
65 | + | ||
66 | + | ||
67 | +<img width="100;" height="70;" align="bottom;" src="khu.png"/> | ||
68 | + | ||
69 | +</form> | ||
70 | + | ||
71 | + | ||
72 | + | ||
73 | +</body> | ||
74 | + | ||
75 | +</html> | ||
... | \ No newline at end of file | ... | \ No newline at end of file |
... | @@ -20,7 +20,6 @@ img { | ... | @@ -20,7 +20,6 @@ img { |
20 | background: white; | 20 | background: white; |
21 | border: solid 5px white; | 21 | border: solid 5px white; |
22 | border-radius: 50%; | 22 | border-radius: 50%; |
23 | - margin-right: 150px; | ||
24 | margin-top: 50px; | 23 | margin-top: 50px; |
25 | } | 24 | } |
26 | #btn2 { | 25 | #btn2 { |
... | @@ -32,7 +31,6 @@ img { | ... | @@ -32,7 +31,6 @@ img { |
32 | background: white; | 31 | background: white; |
33 | border: solid 5px white; | 32 | border: solid 5px white; |
34 | border-radius: 50%; | 33 | border-radius: 50%; |
35 | - margin-left: 150px; | ||
36 | margin-top: 50px; | 34 | margin-top: 50px; |
37 | } | 35 | } |
38 | 36 | ||
... | @@ -40,15 +38,14 @@ img { | ... | @@ -40,15 +38,14 @@ img { |
40 | 38 | ||
41 | <body> | 39 | <body> |
42 | 40 | ||
43 | -<br><br> | 41 | +<br> |
44 | <img style="border-radius:15px;" width="300px;" src="캡처6.png"/><br> | 42 | <img style="border-radius:15px;" width="300px;" src="캡처6.png"/><br> |
45 | <form> | 43 | <form> |
46 | 44 | ||
47 | <br> | 45 | <br> |
48 | 46 | ||
49 | -<center><button id="btn1">대여하기</button></center> | 47 | +<center><button id="btn1">대여하기</button> <button id="btn2">대여현황</button></center> |
50 | -<center><button id="btn2">대여현황</button></center> | 48 | +<br><br><br><br><br><br> |
51 | -<br><br><br><br> | ||
52 | <img width="100;" height="70;" align="bottom;" src="khu.png"/> | 49 | <img width="100;" height="70;" align="bottom;" src="khu.png"/> |
53 | 50 | ||
54 | </form> | 51 | </form> | ... | ... |
... | @@ -14,20 +14,20 @@ img { | ... | @@ -14,20 +14,20 @@ img { |
14 | input[type=text] { | 14 | input[type=text] { |
15 | width: 300px; | 15 | width: 300px; |
16 | box-sizing: border-box; | 16 | box-sizing: border-box; |
17 | - border: 3px solid lightgray; | 17 | + border: 3px solid rgb(191, 191, 191); |
18 | border-radius: 4px; | 18 | border-radius: 4px; |
19 | - font-size: 16px; | 19 | + font-size: 18px; |
20 | + font-family: '배달의민족 도현'; | ||
20 | background-color: rgb(230, 243, 255); | 21 | background-color: rgb(230, 243, 255); |
21 | - background-image: searchicon.png; | 22 | + background-position: 5px 2.5px; |
22 | - background-position: 10px 10px; | ||
23 | background-repeat: no-repeat; | 23 | background-repeat: no-repeat; |
24 | - padding: 12px 20px 12px 40px; | 24 | + padding: 12px 20px 12px 50px; |
25 | -webkit-transition: width 0.4s ease-in-out; | 25 | -webkit-transition: width 0.4s ease-in-out; |
26 | transition: width 0.4s ease-in-out; | 26 | transition: width 0.4s ease-in-out; |
27 | } | 27 | } |
28 | 28 | ||
29 | input[type=text]:focus { | 29 | input[type=text]:focus { |
30 | - width: 50%; | 30 | + width: 30%; |
31 | } | 31 | } |
32 | #btn1 { | 32 | #btn1 { |
33 | width: 300px; | 33 | width: 300px; |
... | @@ -44,13 +44,13 @@ input[type=text]:focus { | ... | @@ -44,13 +44,13 @@ input[type=text]:focus { |
44 | 44 | ||
45 | <body> | 45 | <body> |
46 | 46 | ||
47 | -<br><br> | 47 | +<br> |
48 | -<img style="border-radius:15px;" width="300px;" src="캡처6.png"/> | 48 | +<img style="border-radius:15px;" width="300px;" src="캡처7.png"/> |
49 | <form> | 49 | <form> |
50 | 50 | ||
51 | <br> | 51 | <br> |
52 | 52 | ||
53 | -<center><input type="text" name="search" placeholder="Search.."><image width="30px"src="searchicon.png"></center><br> | 53 | +<center><input style="background-image:url(searchicon.png);" type="text" name="search" placeholder="Search.."></center><br> |
54 | 54 | ||
55 | <center><button id="btn1">강의실</button></center><br> | 55 | <center><button id="btn1">강의실</button></center><br> |
56 | <center><button id="btn1">회의 공간</button></center><br> | 56 | <center><button id="btn1">회의 공간</button></center><br> | ... | ... |
html/로그인.PNG
0 → 100644
2.42 KB
... | @@ -20,6 +20,7 @@ input[type=text] { | ... | @@ -20,6 +20,7 @@ input[type=text] { |
20 | -webkit-transition: 0.5s; | 20 | -webkit-transition: 0.5s; |
21 | transition: 0.5s; | 21 | transition: 0.5s; |
22 | outline: none; | 22 | outline: none; |
23 | + font-family: '배달의민족 도현'; | ||
23 | } | 24 | } |
24 | input[type=text]:focus { | 25 | input[type=text]:focus { |
25 | border: 3px solid #555; | 26 | border: 3px solid #555; |
... | @@ -34,6 +35,7 @@ input[type=password] { | ... | @@ -34,6 +35,7 @@ input[type=password] { |
34 | transition: 0.5s; | 35 | transition: 0.5s; |
35 | outline: none; | 36 | outline: none; |
36 | margin-right: 7px; | 37 | margin-right: 7px; |
38 | + font-family: '배달의민족 도현'; | ||
37 | } | 39 | } |
38 | input[type=password]:focus { | 40 | input[type=password]:focus { |
39 | border: 3px solid #555; | 41 | border: 3px solid #555; |
... | @@ -67,7 +69,7 @@ h2 { | ... | @@ -67,7 +69,7 @@ h2 { |
67 | 69 | ||
68 | <body> | 70 | <body> |
69 | 71 | ||
70 | -<br><br> | 72 | +<br> |
71 | <img style="border-radius:15px;" width="300px;" src="캡처6.png"/> | 73 | <img style="border-radius:15px;" width="300px;" src="캡처6.png"/> |
72 | <form> | 74 | <form> |
73 | 75 | ... | ... |
html/캡처2.PNG
0 → 100644
1.03 KB
html/캡처5.PNG
0 → 100644
26.4 KB
html/캡처6.PNG
0 → 100644
25.5 KB
html/캡처7.PNG
0 → 100644
18.9 KB
html/회원가입.PNG
0 → 100644
3.29 KB
-
Please register or login to post a comment