양효빈

hyob css1

1 -<!DOCTYPE html>
2 -<html>
3 - <head>
4 - <title>HealthProtectorHome</title>
5 - <meta charset="utf-8" />
6 - </head>
7 - <body>
8 - <h1><a href="home.html">HealthProtector</a></h1>
9 - <ol>
10 - <li><a href="1.html">칼로리 계산</a></li>
11 - <li><a href="2.html">음식별 영양정보</a></li>
12 - </ol>
13 - <h2>칼로리 계산</h2>
14 - <form action="./3.html">
15 - 성별 :<br />
16 - <select name="sex">
17 - <option value="man">남자</option>
18 - <option value="woman">여자</option></select
19 - ><br />
20 - 키(cm) : <br />
21 - <input type="text" name="height" /><br />
22 - 몸무게(kg) : <br /><input type="text" name="weight" /><br />
23 - 활동량 :<br />
24 - <select name="activity">
25 - <option value="low">가벼운 활동(주로 앉아서 생활)</option>
26 - <option value="mid">중등 활동(주로 서서 일하거나 생활)</option>
27 - <option value="high">많은 활동(건설, 농업 등 노동이 많은 일)</option>
28 - <option value="veryHigh">매우 많은 활동(운동선수)</option></select
29 - ><br />
30 - <input type="submit" value="계산하기" />
31 - </form>
32 - </body>
33 -</html>
1 -dddd
...\ No newline at end of file ...\ No newline at end of file
No preview for this file type
1 module.exports = { 1 module.exports = {
2 +
2 html:function(title, body){ 3 html:function(title, body){
3 return ` 4 return `
4 <!DOCTYPE html> 5 <!DOCTYPE html>
5 <html> 6 <html>
6 <head> 7 <head>
8 +
7 <title>HelP - ${title}</title> 9 <title>HelP - ${title}</title>
8 <meta charset="utf-8" /> 10 <meta charset="utf-8" />
9 </head> 11 </head>
10 <body> 12 <body>
11 - <h1><a href="/">HealthProtector</a></h1> 13 +
12 - <ol> 14 + <style>
13 - <li><a href="/countKcal">칼로리 계산</a></li> 15 + @import url('https://fonts.googleapis.com/css2?family=Jua&family=Noto+Sans+KR&display=swap');
14 - <li><a href="2.html">음식별 영양정보</a></li> 16 + </style>
15 - </ol> 17 +
18 + <style type="text/css">
19 + div{
20 + @import url('https://fonts.googleapis.com/css2?family=Jua&family=Noto+Sans+KR&display=swap');
21 +
22 + text-align:center;
23 + border:1px solid none;
24 + margin:40px 0px 0px 0px;
25 + padding:20px;
26 +
27 +
28 + }
29 + a { text-decoration:none }
30 + }
31 +
32 + </style>
33 + <div style=font-size:30px;"font-family:'Jua',sans-serif";background-image:url('https://source.unsplash.com/random/1920x1080');>
34 + <h1 style="font-family: 'Jua', sans-serif;"><a href="/"><font color="white">HealthProtector</font></a></h1>
35 + </div>
36 + <br>
37 + <div style= width:47%;"font-family:'Jua',sans-serif";float:left;font-size:20px;padding:5px;>
38 + <h2 style="font-family: 'Jua', sans-serif;"><a href="/countKcal"><font color="black">칼로리 계산</a></h2>
39 + <h4 style="font-family: 'Jua', sans-serif;"><font color="gray">자신에게 맞는 일일 권장 섭취량(kcal)를 계산해보세요!</h4>
40 + </div>
41 + <div style= width:47%;float:right;font-size:20px;padding:0px;>
42 + <h2 style="font-family: 'Jua', sans-serif;"><a href="2.html"><font color="black">음식별 영양정보</a></h2>
43 + <h4 style="font-family: 'Jua', sans-serif;"><font color="gray">음식별 식품 영양정보에 대해 알려드립니다!</h4>
44 + </div>
45 + <br><br><br><br><br>
16 ${body} 46 ${body}
47 +
48 + <div style= width:100%;font-size:10px;position:fixed;bottom:0;float:left;padding:0px;background-color:#0B610B;>
49 + <h4><a href="2.html"><font color="white">Copyright HealThProtector 2020</a></h4>
50 + </div>
17 </body> 51 </body>
18 </html> 52 </html>
19 53
......
1 +
1 var http = require('http'); 2 var http = require('http');
2 var fs = require('fs'); 3 var fs = require('fs');
3 var url = require('url'); 4 var url = require('url');
4 var qs = require('querystring'); 5 var qs = require('querystring');
5 var template = require('./lib/template.js'); 6 var template = require('./lib/template.js');
7 +/*
8 +const style={
9 + backgrondColor = 'blue',
10 + border:'1px solid border'
11 +
12 +}*/
13 +
14 +const { count } = require('console');
15 +
6 var app = http.createServer(function(request,response){ 16 var app = http.createServer(function(request,response){
7 var _url = request.url; 17 var _url = request.url;
8 var queryData = url.parse(_url, true).query; 18 var queryData = url.parse(_url, true).query;
...@@ -12,8 +22,13 @@ var app = http.createServer(function(request,response){ ...@@ -12,8 +22,13 @@ var app = http.createServer(function(request,response){
12 var title = '소개'; 22 var title = '소개';
13 var description = '개개인의 신체 정보에 따라 일일 권장 섭취량을 알려주고, 좋아하는 음식을 검색하면 영양정보를 알려주는 사이트 입니다.'; 23 var description = '개개인의 신체 정보에 따라 일일 권장 섭취량을 알려주고, 좋아하는 음식을 검색하면 영양정보를 알려주는 사이트 입니다.';
14 var html = template.html(title,` 24 var html = template.html(title,`
15 - <h2>${title}</h2> 25 + <br><br><br><br>
16 - <p>${description}</p>` ); 26 + <style>
27 + @import url('https://fonts.googleapis.com/css2?family=Jua&family=Noto+Sans+KR&display=swap');
28 + </style>
29 + <h2 style="font-family: 'Jua', sans-serif;"><font color="red"><text align:center>${title}</font></h2>
30 + <p style="font-family: 'Jua', sans-serif;">${description}</p>` );
31 +
17 response.writeHead(200); 32 response.writeHead(200);
18 response.end(html); 33 response.end(html);
19 } 34 }
......
1 +{
2 + "name": "healthprotector",
3 + "version": "1.0.0",
4 + "lockfileVersion": 1,
5 + "requires": true,
6 + "dependencies": {
7 + "js-tokens": {
8 + "version": "4.0.0",
9 + "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
10 + "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
11 + },
12 + "loose-envify": {
13 + "version": "1.4.0",
14 + "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
15 + "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
16 + "requires": {
17 + "js-tokens": "^3.0.0 || ^4.0.0"
18 + }
19 + },
20 + "object-assign": {
21 + "version": "4.1.1",
22 + "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
23 + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
24 + },
25 + "react": {
26 + "version": "17.0.1",
27 + "resolved": "https://registry.npmjs.org/react/-/react-17.0.1.tgz",
28 + "integrity": "sha512-lG9c9UuMHdcAexXtigOZLX8exLWkW0Ku29qPRU8uhF2R9BN96dLCt0psvzPLlHc5OWkgymP3qwTRgbnw5BKx3w==",
29 + "requires": {
30 + "loose-envify": "^1.1.0",
31 + "object-assign": "^4.1.1"
32 + }
33 + },
34 + "react-dom": {
35 + "version": "17.0.1",
36 + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.1.tgz",
37 + "integrity": "sha512-6eV150oJZ9U2t9svnsspTMrWNyHc6chX0KzDeAOXftRa8bNeOKTTfCJ7KorIwenkHd2xqVTBTCZd79yk/lx/Ug==",
38 + "requires": {
39 + "loose-envify": "^1.1.0",
40 + "object-assign": "^4.1.1",
41 + "scheduler": "^0.20.1"
42 + }
43 + },
44 + "scheduler": {
45 + "version": "0.20.1",
46 + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.1.tgz",
47 + "integrity": "sha512-LKTe+2xNJBNxu/QhHvDR14wUXHRQbVY5ZOYpOGWRzhydZUqrLb2JBvLPY7cAqFmqrWuDED0Mjk7013SZiOz6Bw==",
48 + "requires": {
49 + "loose-envify": "^1.1.0",
50 + "object-assign": "^4.1.1"
51 + }
52 + }
53 + }
54 +}
1 { 1 {
2 "name": "healthprotector", 2 "name": "healthprotector",
3 "version": "1.0.0", 3 "version": "1.0.0",
4 - "description": "",
5 "main": "main.js", 4 "main": "main.js",
6 "scripts": { 5 "scripts": {
7 "test": "echo \"Error: no test specified\" && exit 1" 6 "test": "echo \"Error: no test specified\" && exit 1"
8 }, 7 },
9 "author": "", 8 "author": "",
10 - "license": "ISC" 9 + "license": "ISC",
10 + "directories": {
11 + "lib": "lib"
12 + },
13 + "repository": {
14 + "type": "git",
15 + "url": "http://khuhub.khu.ac.kr/2019102154/HealthProtector.git"
16 + },
17 + "description": "",
18 + "dependencies": {
19 + "react": "^17.0.1",
20 + "react-dom": "^17.0.1"
21 + }
11 } 22 }
......
1 +@font-face{
2 + src:url("fonts/BMJUA_ttf.ttf");
3 + font-family: "jua";
4 +
5 +}
6 +
7 +h2{
8 + font-family: "jua";
9 +}
...\ No newline at end of file ...\ No newline at end of file