sdy
...@@ -11,15 +11,15 @@ a{text-decoration: none;color: black;} ...@@ -11,15 +11,15 @@ a{text-decoration: none;color: black;}
11 } 11 }
12 12
13 #khu-logo{ 13 #khu-logo{
14 - align-content: space-between;
15 - display: inline-block;
16 font-size: 0; 14 font-size: 0;
17 padding: 0; 15 padding: 0;
18 border:none; 16 border:none;
17 +
19 } 18 }
19 +
20 #khu-logo-font{ 20 #khu-logo-font{
21 font-family: 'Black Han Sans', sans-serif; 21 font-family: 'Black Han Sans', sans-serif;
22 - align-content: space-between; 22 + align-content: center;
23 font-size:20px; 23 font-size:20px;
24 line-height: inherit; 24 line-height: inherit;
25 display: inline-block; 25 display: inline-block;
...@@ -28,15 +28,36 @@ a{text-decoration: none;color: black;} ...@@ -28,15 +28,36 @@ a{text-decoration: none;color: black;}
28 } 28 }
29 29
30 .khu-nav{ 30 .khu-nav{
31 - display:flex;
32 - justify-content: space-between;
33 padding:20px; 31 padding:20px;
34 height:center; 32 height:center;
35 background-color: white; 33 background-color: white;
36 border-bottom: 1px solid #ebeaeb; 34 border-bottom: 1px solid #ebeaeb;
37 } 35 }
38 .khu-nav-row{ 36 .khu-nav-row{
37 + height: 100%;
39 display:flex; 38 display:flex;
40 justify-content: space-between; 39 justify-content: space-between;
40 + padding-left: 200px;
41 + padding-right: 200px;
41 } 42 }
43 +
44 +
45 +#khu-start-button{
46 + font-family: 'Black Han Sans', sans-serif;
47 + -webkit-appearance: none;
48 + -moz-appearance: none;
49 + appearance: none;
50 + background: 0 0;
51 + border: none;
52 + cursor: pointer;
53 + border-radius: 4px;
54 + text-align: center;
55 + background-color: #611f69;
56 + color: #fff;
57 + fill: #fff;
58 + padding: 10px;
59 +
60 +}
61 +
62 +@media screen and (min-width:0) and (max-width:767px){.khu-nav-row{padding:0 4vw}
42 </style> 63 </style>
......
1 +var Click={
2 + Launchclick:function(color){
3 + // var alist=document.querySelectorAll('a');
4 + // var i =0;
5 + // while(i<alist.length)
6 + // {
7 + // alist[i].style.color=color;
8 + // i+=1;
9 + // }
10 + // }
11 + //$('a').css('color',color); //jquery 사용한 것.
12 +
13 + }
14 +}
15 +var Body = {
16 + SetColor:function(color){
17 + //document.querySelector('body').style.color= color;
18 + $('body').css('color',color);
19 +
20 + },
21 + SetBackGruondColor:function(color){
22 + //document.querySelector('body').style.backgroundColor= color;
23 + $('body').css('backgroundColor',color);
24 + }
25 +}
26 +
27 +function nightDayHandler(self){
28 + if(self.value==='night')
29 + {
30 + Body.SetBackGruondColor('black')
31 + Body.SetColor('white');
32 + self.value= 'day';
33 +
34 + Links.SetColor('powderblue');
35 +
36 + }else{
37 + Body.SetBackGruondColor('white')
38 + Body.SetColor('black');
39 + self.value= 'night';
40 +
41 + Links.SetColor('blue');
42 + }
43 + }
1 <!doctype html> 1 <!doctype html>
2 <html> 2 <html>
3 <head> 3 <head>
4 -<title>KHU KHU Chat</title>
5 -<meta charset="utf-8">
6 -<link rel="stylesheet" href="style/style.css">
7 -<style>
8 4
9 -</style> 5 + <title>KHU Chat</title>
10 -</head> 6 + <meta charset="utf-8">
11 -<body> 7 + <link rel="stylesheet" href="CSS/Banner.css">
8 + <script src="https://kit.fontawesome.com/6a5db0a2e0.js" crossorigin="anonymous"></script>
9 + <link rel="icon" href="https://kit.fontawesome.com/6a5db0a2e0.js" />
10 + <link href="https://fonts.googleapis.com/css2?family=Black+Han+Sans&display=swap" rel="stylesheet">
11 + <script src="JS/main.js"></script>
12 + </head>
13 + <body>
14 + <header role="banner">
15 + <nav class="khu-nav" role="navigation" aria-label="Primary navigation">
16 + <div class="khu-nav-row">
17 + <div class="khu-logo">
18 + <a id="khu-logo" data-clog-click="" data-clog-ui-element="link_home" href="main.html" aria-label="Khu-logo" data-qa="logo">
19 + <img src="img/Khu_Chat_Icon.svg" width="30px" hegiht="20px" alt="Khu Chat">
20 + </a>
21 +
22 + <a id="khu-logo-font" data-clog-click="" data-clog-ui-element="link_home" href="main.html" aria-label="Khu-logo-font" data-qa="logo">
23 + Khu Chat
24 + </a>
25 + </div>
26 + <div class ="khu-login" >
27 + <a data-clog-click="" data-clog-ui-element="link_home" href="main.html" aria-label="Khu-logo-font" data-qa="logo">
28 + Login
29 + </a>
30 + </div>
31 + <div class="khu-signin">
32 + <a data-clog-click="" data-clog-ui-element="link_home" href="main.html" aria-label="Khu-logo-font" data-qa="logo">
33 + Sign in
34 + </a>
35 + </div>
36 + <div class="khu-start-button">
37 + <button id="khu-start-button" onclick="" data-clog-click="" data-clog-ui-element="link_home" href="main.html" aria-label="Khu-start-button" data-qa="logo">
38 + Launch Chating
39 + </button>
40 + </div>
41 + </div>
42 +</nav>
12 43
13 <h1><a href="main.html" color:black>KHU Chatting service</a></h1> 44 <h1><a href="main.html" color:black>KHU Chatting service</a></h1>
14 <img src="image/welcome.jpg" class="image"> 45 <img src="image/welcome.jpg" class="image">
...@@ -46,6 +77,5 @@ ...@@ -46,6 +77,5 @@
46 </form> 77 </form>
47 </div> 78 </div>
48 </div> 79 </div>
49 -
50 </body> 80 </body>
51 </html> 81 </html>
......
This diff is collapsed. Click to expand it.