명품 html5 + css3 + javascript 웹 프로그래밍 실습문제 2장 - myeongpum html5 + css3 + javascript web peulogeulaeming silseubmunje 2jang

Question

2장과제.zip

6.32MB

1.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>산길</title>
</head>
<body>
<h3>산길</h3>
<hr>
<p><strong>오늘 아침 일찍 산에 올랐다. 아침 온도는 15&#176;이었다. 가지고 간 물의 &#189;을 마셨다. 한참 올라 가는 도중에 약수터를 가리키는&#8624; 사인이 보였다. 불현듯 양두종 님의 산길이란 시에 곡을 붙인 바태준의 가곡&#9834;이 생각이 났다.</strong></p>
<pre>
		산길을 간다. 말없이
		호올로 산길을 간다

		해는 져서 새로리 그치고
		짐승의 발자취 그윽히 들리는

		산길을 간다 말없이
		밤에 홀로 산길을 간다
</pre>
<strong>&#169; Copyright(c) 황기태 All rights resrved. &#9742; 010-0000-9999</strong>
</body>
</html>

2.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>도시 소개</title>
</head>
<body>
<h3>도시 소개</h3>
<hr>
<dl>
	<dt><strong>California</strong>
		<dd>맑고 화창한 날씨가 좋고 태평양의 아름다운 해변을 가진 멋진 주</dd>
	<dt><strong>Florida</strong>
		<dd>미국의 동남부에 위치한 주로서 많은 휴양 도시가 있고 미국의 최남단이 연결된 아름다운 주</dd>
	<dt><strong>Texas</strong>
		<dd>드넓은 목장들이 있어 텍사스 바베큐로 유명하고 석유가 생산되는 주</dd>	
</body>
</html>

3.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>나의 셀카</title>
</head>
<body>
<h3>나의 셀카</h3>
<hr>
<table>
	<caption>나의 셀카</caption>
	<tbody>
	<tr>
		<td><img src="media/self1.jpg" width="300" height="300"></td>
		<td><img src="media/self2.jpg" width="300" height="300"></td>
		<td><img src="media/self3.jpg" width="300" height="300"></td>
	</tr>
</tbody>
</table>
</body>
</html>

4.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>신체 검사</title>
</head>
<body>
<h3>신체 검사</h3>
<hr>
<table border="1">
	<caption>학생 신체 검사 표</caption>
	<thead><tr><th>이름</th><th>키</th><th>체중</th><th>시력</th></thead>
	<tfoot><tr><th>평균</th><th>181</th><th>77</th><th>1.3</th></tfoot>
	<tbody>
		<tr><td>황기태</td><td>179</td><td>67</td><td>1.0</td></tr>
		<tr><td>이재문</td><td>177</td><td>77</td><td>2.0</td></tr>
		<tr><td>정인환</td><td>189</td><td>87</td><td>1.2</td></tr>
	</tbody>
</table>
</body>
</html>

4-2.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>과일 수입</title>
</head>
<body>
<h3>과일 수입</h3>
<hr>
<table border="1">
	<caption>과일 수입 표</caption>
	<thead><tr><th>사과</th><th>바나나</th><th>망고</th></tr></thead>
	<tfoot><tr><th>페루</th><th>필리핀</th><th>호주</th></tr></tfoot>
	<tbody>
		<tr>
			<td><img src="media/apple.png"></td>
			<td><img src="media/mango.png"></td>
			<td><img src="media/banana.png"></td>
		</tr>
	</tbody>
</table>
</body>
</html>

5.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>웹 프로그래밍 참조 사이트</title>
</head>
<body>
<h3>웹 프로그래밍 참조 사이트</h3>
<hr>
<ul>
	<li><a href="http://html5.validator.nu/" target="_blank">HTML5 태그 스타일 검사</a></li>
	<li><a href="http://www.css-validator.org/validator.html.ko/" target="_blank">CSS3 스타일 시트 검사 사이트</a></li>
	<li><a href="http://html5.org/" target="_blank">HTML5 표준</a></li>
</ul>
</body>
</html>

6.

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>애국가 가사</title>
</head>
<body>
<h3>애국가 가사</h3>
<hr>
<p>동해물과 백두산이 마르고 닳도록 하나님이
	보우하사 우리나라 만세 무궁화 삼천리 화려강산
	대한사람 대한으로 길이 보전하세.
</p>
<audio src="media/korea.mp3" controls autoplay></audio>
</body>
</html>

오픈챌린지

left.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>목차</title>
</head>
<body>
<h3>목차</h3>
<ul>
	<li><a href="right.html#terran" target="right">테란</a></li>
	<li><a href="right.html#zerg" target="right">저그</a></li>
	<li><a href="right.html#protoss" target="right">프로토스</a></li>
	<li><a href="right.html#scs" target="right">스크린샷</a></li>
</ul>
</body>
</html>

right.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>스타크래프트</title>
</head>
<body>
<h3 id="terran"><a href="https://namu.wiki/w/%ED%85%8C%EB%9E%80" target="_blank">테란</a></h3>
<p>
	Terran. 스타크래프트 시리즈에 등장하는 종족. 가장 허약하고 약한 군사력과 낮은 수준의 문명을 가졌으며모성을 포함하여 다른 종족에게 천대를 받았지만 끈기와 놀라운 지혜로 압도적인 적들과 싸우고 마지막에 전 우주를 파멸시키려 했던 암흑의 신을 쓰러뜨린 세 종족 중 하나.
	코프룰루 구역에 정착한 인류를 가리키는 말. 엄밀히 말해서 '테란'은 종족이 아니라 테란 연합, 테란 자치령 같은 특정 세력명을 부르는 말이었다. 그러나 저그, 프로토스들이 인류의 '세력'이라면 연합이던 자치령이던 켈모리안이건 심지어 UED라도 테란이라고 부르며 코프룰루 사람들도 자신들을 테란이라고 부른다. 즉, 보통명사가 된 고유명사들의 한 케이스라고 볼 수 있다. 또한, 스토리 상으로는 저그와 프로토스라는 막강한 두 외계인 사이에 끼인 새우처럼 쩌리 종족 취급받는 느낌이 강하지만 사실상 지배하고 있는 행성이나 세력은 제일 크고 많다. 고향인 태양계는 물론이고, 코프룰루 안에서만 해도 여러 분파로 나뉘어져 있다. 저그처럼 엄청난 적응력과 힘도, 프로토스처럼 강력한 초능력과 뛰어난 기술력도 없지만 이를 의지와 단결, 그리고 근성과 적응력으로 극복한 전투종족. 테란을 상징하는 색깔은 인류가 가장 많이 쓰는 금속인 철의 회색, 가장 거대한 테란 세력인 테란 자치령의 상징인 빨간색이다. 자유의 날개의 주인공 세력인 레이너 특공대에 한해서는 파란색을 쓰고 있다. 또한 프로토스나 초월체 휘하 저그 처럼 자체적으로는 젤나가를 신봉하지 않는다. 하지만 테란은 결과적으로는 젤나가를 배출한 종족이 되었다.
</p>
<h3 id="zerg"><a href="https://namu.wiki/w/%EC%A0%80%EA%B7%B8" target="_blank">저그</a></h3>
<p>
	Zerg. 게임 스타크래프트 시리즈에 등장하는 외계 종족.
	젤나가(Xel'naga)가 창조한 두 번째 생명체이자 스타크래프트 세계관의 공공의 적.테란에게는 바이러스 감염과 행성 침공으로 뼈아픈 피해를 준 괴물들이자, 프로토스에게는 자신의 고향행성을 강탈하고 수많은 영웅과 전사들을 전사시킨 원수들이자, 사라 케리건이 죽은 미래에서는 우주를 파멸시킬 아몬의 꼭두각시이며 저그 자신들도 군체의식의 지배권을 놓고 전 은하계에서 피 터지게 싸운다.
	소설 스타크래프트에서는 벌레를 뜻하는 Bug에 최종 진화 단계라는 설정으로 Z자를 맨 앞에 집어넣어 Zug라는 이름이 탄생했고, 이후 Zerg로 바뀌었다고 적혀 있지만 어디까지나 비공식 설정이다. 초창기 알파 버전에서의 이름은 악몽의 침략군(Nightmarish Invaders)이라는 센스없는 이름이었다. 이후 스타크래프트 본편 직전 차우 사라에 코랄의 후예들을 제압하려고 파견 나온 알파 전대 장교의 이야기를 다루는 데모에선 테란측에서 수수께끼의 Xenomorph와 Nightmare Invader라 불렀다.
	본래 저그는 제루스 행성에 살던 작은 애벌레형 종족이었다. 태초의 저그는 다른 동물의 신경계에 파고들어 지배권을 빼앗는 기생 능력을 가지고 있었다. 이 에벌레들은 제루스 토착 동물의 신경계에 파고들어 숙주의 DNA를 흡수하여 진화했고, 수천년 동안 같은 저그를 비롯한 다른 생명체를 잡아먹고 그들의 정수를 흡수하며 진화하는 과정을 통해 원시 저그의 형태를 띄게 되었다.
	이러한 약육강식을 통한 진화를 반복하던 중, 육체적 완전성을 목표로 인공적으로 진화된 첫번째 생명체 프로토스와 마찬가지로 저그도 프로토스처럼 아몬에 의해 순수한 정수를 목표로 인공적으로 진화되었다. 이렇게 저그를 조작한 아몬은 자신의 하수인으로 초월체를 창조했고, 이에 따라 몇몇 원시 저그 무리를 제외한 모든 저그는 하나의 생명체 처럼 하나의 목표를 위해 움직이는 집단 지성의 형태를 띄게 되었다.
</p>
<h3 id="protoss"><a href="https://namu.wiki/w/%ED%94%84%EB%A1%9C%ED%86%A0%EC%8A%A4" target="_blank">프로토스</a></h3>
<p>
	Protoss. 스타크래프트 시리즈에 나오는 세 종족 중 하나. 우주 문명의 척도에서 제II유형(모 항성의 모든 에너지와 항성계의 모든 자원을 사용)에 해당하는 문명 수준을 이룬 종족이다. 이름은 그리스어로 '최초', '처음'을 뜻하는 프로토스(πρῶτος, protos)에서 유래했다. '첫 번째 자손(The Firstborn)'이라는 의미.
	그래서 '첫 번째 자손'이라는 명칭도 본인들이나 다른 종족들이나 자주 쓰는 편. 그리고 우리가 익히 알고 있는 프로토스의 유닛, 건물, 직위에 관한 명칭은 저그처럼 프로토스가 코프룰루 구역에 나오면서 테란이 임의로 붙인 것이다. 내적으로는 로마 제국에 프레데터를 섞은 듯한 구성을 가진다. 그래서 지구 역사에서 고대에 없어진 관직들이 아직도 존속하면서도 기술력이나 정신 수준은 지구인을 아득히 뛰어넘는 신비한 종족이다.
	평소에 연상할 수 있는 외계인의 모습과는 좀 많이 다르지만, 어쨌든 보면 '아, 외계인이다' 하고 생각할 수 있다. 외견상, 그리고 실제로도 저그와 테란에 비해 초월적인 기술력을 보유한 것에 반해 상당히 종교적인 성향을 띠고 있는 데다 판타지에 나올 법한 각종 초능력, 압도적인 신체 능력, 화려하고 아름다운 병기와 갑옷 등에서 뿜어져 나오는 포스는 그야말로 간지폭풍. 스토리상 저그에게 크게 당하고 테란에게 애를 먹지만, 그 전에는 은하계에서 맞설 적수가 없는 종족이었다. 다만, 탈다림이 기존의 이미지와는 다른 특징과 행보를 보여준다. 자세한건 노바 비밀 작전 참고.
	또한 프로토스는 종교적이나 여러 윤리적인 이유로 자신들의 고도화된 기술을 활용을 하지 않을 때가 많다.
	각 프로토스 세력들이 상징하는 색깔은 서로 다르다. 칼라이 프로토스는 특유의 금색을 입힌 파란색을 쓰고 수정으로는 케이다린 수정을, 네라짐 프로토스는 은색을 입힌 초록색을 쓰고 수정으로는 케이다린 수정을 개량한 아르거스 수정을, 정화자 프로토스는 하얀색을 입힌 노란색을 쓰고 수정으로는 기사단 프로토스와 마찬가지로 케이다린 수정을 사용하거나 태양석을 사용하며, 탈다림 프로토스는 검정색을 입힌 빨간색을 쓰고 수정으로는 혈석 수정을 사용한다.
</p>
<h3 id="scs">스크린샷</a></h3>
<table>
	<caption>스타크래프트의 스크린샷</caption>
	<tr>
		<td><img src="media/scs1.jpg" width="300" height="200"></td>
		<td><img src="media/scs2.jpg" width="300" height="200"></td>
		<td><img src="media/scs3.jpg" width="300" height="200"></td>
	</tr>
</table>
<strong>Copyright 2018 by Numerok</strong>
</body>
</html>

openchallenge.html

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>스타크래프트와 종족 소개</title>
</head>
<body>
<h2>스타크래프트</h2>
<p>
	블리자드 엔터테인먼트에서 제작한 RTS 게임으로, 스타크래프트 오리지널은 1998년 3월 31일에 출시하였고, 확장팩인 스타크래프트: 브루드 워는 1998년 11월 30일에 출시하였다. 다른 게임들처럼 원래 유료였지만, 2017년 3월 26일에 스타크래프트: 리마스터와 함께 무료화를 발표하였고, 2017년 4월 19일에 1.18 패치를 내놓으면서 무료로 전환하였다
</p>
<iframe src="left.html" name="left" width="300" height="500"></iframe>
<iframe src="right.html" name="right" width="1000" height="500"></iframe>
<audio src="media/bgm.mp3" loop autoplay ></audio>
</body>
</html>

명품웹 프로그래밍 연습문제 웹프