Showing
4 changed files
with
52 additions
and
117 deletions
... | @@ -2,7 +2,7 @@ | ... | @@ -2,7 +2,7 @@ |
2 | /*---------scroll snap 부분---------*/ | 2 | /*---------scroll snap 부분---------*/ |
3 | body { | 3 | body { |
4 | overflow: hidden; | 4 | overflow: hidden; |
5 | - font-family: Noto Sans KR, Bold; | 5 | + font-family: 'Roboto Slab', serif; |
6 | } | 6 | } |
7 | /* Scroll down */ | 7 | /* Scroll down */ |
8 | #container{ | 8 | #container{ | ... | ... |
... | @@ -3,71 +3,44 @@ | ... | @@ -3,71 +3,44 @@ |
3 | 3 | ||
4 | <head> | 4 | <head> |
5 | <title>EMOJI-HUMAN</title> | 5 | <title>EMOJI-HUMAN</title> |
6 | - <link rel="stylesheet" href="https://odd-mune.github.io/EMOJI-HUMAN/index.css"> | 6 | + <link rel="stylesheet" href="/index.css"> |
7 | - <link rel="icon" type="image/x-icon" href="https://odd-mune.github.io/EMOJI-HUMAN/src/rainbow_1f308.png"> | 7 | + <link rel="icon" type="image/x-icon" href="/src/rainbow_1f308.png"> |
8 | - <style> | ||
9 | - body { | ||
10 | - background-image: url("emossage-03.png"); | ||
11 | - background-repeat: no-repeat; | ||
12 | - background-size: 100%; | ||
13 | - font-family: Noto Sans KR, regular; | ||
14 | - text-align: center; | ||
15 | - } | ||
16 | - h1 {font-size: 50px;} | ||
17 | - p1 {font-size: 24px;} | ||
18 | - p2 {font-size: 14px} | ||
19 | - p2.small {line-height: 0.7;} | ||
20 | - </style> | ||
21 | - <div style="height: 100px; overflow: auto"> | ||
22 | - </div> | ||
23 | - | ||
24 | - | ||
25 | </head> | 8 | </head> |
26 | 9 | ||
27 | <body> | 10 | <body> |
28 | - <form action="#"> | ||
29 | - | ||
30 | - <header> | ||
31 | - <h1>Message + EMOJI<span>= Emossage</span></h1> | ||
32 | - <p1>Emoti는 이모지 중심 메세지입니다</p1> | ||
33 | - <br> | ||
34 | - <p2> | ||
35 | - <p class="small"> 글자 중 일부가 이모지로 변환됩니다.<br> | ||
36 | - 여러분만의 이모지 편지를 적어보세요<br> </p2> | ||
37 | - </p> | ||
38 | - </header> | ||
39 | - | ||
40 | - <div> | ||
41 | - <label class="desc" id="title1" for="Field1">Full Name</label> | ||
42 | - <div> | ||
43 | - <input id="Field1" name="Field1" type="text" class="field text fn" value="" size="8" tabindex="1"> | ||
44 | - </div> | ||
45 | - </div> | ||
46 | 11 | ||
47 | - <div> | ||
48 | - <label class="desc" id="title3" for="Field3"> | ||
49 | |||
50 | - </label> | ||
51 | - <div> | ||
52 | - <input id="Field3" name="Field3" type="email" spellcheck="false" value="" maxlength="255" tabindex="3"> | ||
53 | - </div> | ||
54 | - </div> | ||
55 | 12 | ||
56 | - <div> | ||
57 | - <label class="desc" id="title4" for="Field4"> | ||
58 | - Message | ||
59 | - </label> | ||
60 | - | ||
61 | - <div> | ||
62 | - <textarea id="Field4" name="Field4" spellcheck="true" rows="10" cols="50" tabindex="4"></textarea> | ||
63 | - </div> | ||
64 | - | ||
65 | - <div> | ||
66 | - <input id="saveForm" name="saveForm" type="submit" value="Submit"> | ||
67 | - </div> | ||
68 | - </div> | ||
69 | 13 | ||
70 | - </form> | 14 | + <!-- 내비게이션 --> |
15 | + <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"><!--bootstrap--> | ||
16 | + <!--css link--> | ||
17 | + <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"><!--for icons--> | ||
18 | + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><!--jquery script--> | ||
19 | + <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><!--bootstrap script--> | ||
20 | + | ||
21 | + <body id="page-top"> | ||
22 | + <!--creating a navigation bar--> | ||
23 | + <nav id="main-nav" class="navbar navbar-default navbar-fixed-top navbar-custom"><!--navigation bar with default view fixed on top specific class nav-bar custom--> | ||
24 | + <div class="container"><!--gives padding of 16px on LHS and RHS--> | ||
25 | + <div class="navbar-header page-scroll"><!--navigation bar header having proprty to scroll --> | ||
26 | + <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1"> | ||
27 | + <span></span> Menu <i class="fa fa-bars"></i> | ||
28 | + </button> | ||
29 | + </div><!--end of button--> | ||
30 | + <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><!--to collapse--> | ||
31 | + <ul class="nav navbar-nav"> | ||
32 | + <li><a href="/index.html">Home</a></li> | ||
33 | + </ul> | ||
34 | + <ul class="nav navbar-nav navbar-right page-scroll"><!--second UL to go to right having proprty to scroll page--> | ||
35 | + <li> <a href="/About Us/About Us.html">About Us</a></li> | ||
36 | + <li><a href="/EMOJI-HUMAN/EMOJI-HUMAN.html">EMOJI-HUMAN</a></li> | ||
37 | + <li><a href="/EMO-TI/EMO-TI.html">EMO-TI</a></li> | ||
38 | + <li><a href="/EMO-SSAGE/EMO-SSAGE.html">EMO-SSAGE</a></li> | ||
39 | + </ul> | ||
40 | + </div><!--end of collapse--> | ||
41 | + </div> | ||
42 | + </nav> | ||
43 | + <!-- 내비게이션 --> | ||
71 | 44 | ||
72 | 45 | ||
73 | 46 | ... | ... |
... | @@ -8,38 +8,19 @@ | ... | @@ -8,38 +8,19 @@ |
8 | <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css"/> | 8 | <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.css"/> |
9 | <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"/> | 9 | <link rel="stylesheet" href="https://unpkg.com/swiper/swiper-bundle.min.css"/> |
10 | <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script> | 10 | <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script> |
11 | - <link rel="stylesheet" href="https://odd-mune.github.io/EMOJI-HUMAN/EMO-TI/EMO-TI.css"> | 11 | + <link rel="stylesheet" href="/EMO-TI/EMO-TI.css"> |
12 | - <style> | ||
13 | - body { | ||
14 | - background-image: url("shrink-05.png"); | ||
15 | - background-repeat: no-repeat; | ||
16 | - background-size: 100%; | ||
17 | - font-family: Noto Sans KR, regular; | ||
18 | - font-size: 25pt; | ||
19 | - text-align: center; | ||
20 | - } | ||
21 | - h1 {font-size: 50px;} | ||
22 | - p1 {font-size: 24px;} | ||
23 | - p2 {font-size: 14px} | ||
24 | - p2.small {line-height: 0.7;} | ||
25 | - } | ||
26 | - </style> | ||
27 | - <div style="height: 100px; overflow: auto"> | ||
28 | - </div> | ||
29 | - | ||
30 | </head> | 12 | </head> |
31 | 13 | ||
32 | <!-- style="background-image: url(/src/background-01.png); background-position: center; background-size: cover;" --> | 14 | <!-- style="background-image: url(/src/background-01.png); background-position: center; background-size: cover;" --> |
33 | 15 | ||
34 | <body> | 16 | <body> |
35 | 17 | ||
36 | - <h1>MBTI + EMOJI<span>= EMOTI</span></h1> | 18 | + <!-- 내비게이션 --> |
37 | - <p1>MBTI가 이모지라면? 그건 바로 EMOTI!</p1> | 19 | + <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"><!--bootstrap--> |
38 | - <br> | 20 | + <!--css link--> |
39 | - <p2> | 21 | + <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"><!--for icons--> |
40 | - <p class="small"> 당신의 mbti가 이모지로 어떻게 바뀌었을지,<br> | 22 | + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><!--jquery script--> |
41 | - 아래의 카드에서 한 번 찾아보세요!<br> </p2> | 23 | + <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><!--bootstrap script--> |
42 | - </p> | ||
43 | 24 | ||
44 | <body id="page-top"> | 25 | <body id="page-top"> |
45 | <!--creating a navigation bar--> | 26 | <!--creating a navigation bar--> | ... | ... |
... | @@ -4,39 +4,20 @@ | ... | @@ -4,39 +4,20 @@ |
4 | <head> | 4 | <head> |
5 | <meta charset="UTF-8"> | 5 | <meta charset="UTF-8"> |
6 | <title>EMOJI-HUMAN</title> | 6 | <title>EMOJI-HUMAN</title> |
7 | - <link rel="stylesheet" href="="https://odd-mune.github.io/EMOJI-HUMAN//index.css"> | 7 | + <link rel="stylesheet" href="/EMOJI-HUMAN.css"> |
8 | - <link rel="icon" type="image/x-icon" href="https://odd-mune.github.io/EMOJI-HUMAN/src/rainbow_1f308.png"> | 8 | + <link rel="icon" type="image/x-icon" href="/src/rainbow_1f308.png"> |
9 | -/* | 9 | + |
10 | - <DIV style="position:absolute; left: 241px; top: 49px;"><A href="https://odd-mune.github.io/EMOJI-HUMAN/About Us/About Us.html"> About us? </A></div> | ||
11 | - <DIV style="position:absolute; left: 964px; top: 49px;"><A href="https://odd-mune.github.io/EMOJI-HUMAN/EMO-TI/EMO-TI.html"> Emoti</A></div> | ||
12 | - <DIV style="position:absolute; left: 1269px; top: 49px;"><A href="https://odd-mune.github.io/EMOJI-HUMAN/EMO-SSAGE/EMO-SSAGE.html"> Emossage</A></div> | ||
13 | - */ | ||
14 | - <style> | ||
15 | - body { | ||
16 | - background-image: url("emojihuman-04.png"); | ||
17 | - background-repeat: no-repeat; | ||
18 | - background-size: 100%; | ||
19 | - font-family: Noto Sans KR, regular; | ||
20 | - text-align: center; | ||
21 | - } | ||
22 | - h1 {font-size: 50px; | ||
23 | - letter-spacing: 10px;} | ||
24 | - p1 {font-size: 24px;} | ||
25 | - p2 {font-size: 14px} | ||
26 | - p2.small {line-height: 0.7;} | ||
27 | - </style> | ||
28 | - <div style="height: 100px; overflow: auto"> | ||
29 | - </div> | ||
30 | </head> | 10 | </head> |
31 | 11 | ||
32 | -<body> | 12 | + |
33 | - <h1>Emoji Human,<span> Who are you?</span></h1> | 13 | +<body style="margin: 0 auto"> |
34 | - <p1>이모지 인간의 정체가 궁금해요.</p1> | 14 | + |
35 | - <br> | 15 | + <!-- 내비게이션 --> |
36 | - <p2> | 16 | + <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"><!--bootstrap--> |
37 | - <p class="small"> 이모지일까요, 인간일까요?<br> | 17 | + <!--css link--> |
38 | - 직접 대화하면서<br> 차근차근 알아가봅시다! </p2> | 18 | + <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"><!--for icons--> |
39 | - </p> | 19 | + <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script><!--jquery script--> |
20 | + <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><!--bootstrap script--> | ||
40 | 21 | ||
41 | <body id="page-top"> | 22 | <body id="page-top"> |
42 | <!--creating a navigation bar--> | 23 | <!--creating a navigation bar--> | ... | ... |
-
Please register or login to post a comment