반응형
<!DOCTYPE html>
<html>
<head>
<title>문단 제목 달기</title>
</head>
<body>
<h1>1장 홈페이지 만들기</h1>
<h2>1절 HTML 언어</h2>
<h3>1. 웹</h3>
<h4>1.1 인터넷 </h4>
<h5>1.1.1 네트워크</h5>
<h6>1.1.1.1 통신</h6>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title><div>블록과 <span>인라인</title>
</head>
<body>
<h3>사랑</h3>
<hr>
<div style="background-color:skyblue;padding:20px;">
내가 사람의 방언과 천사의 말을 할지라도
<span style="color:red">사랑</span>이 없으면 소리 나는 구리와 울리는 꽹과리가 되고,
<span style="color:red">사랑</span>이 없으면 아무 것도 아니라.
</div>
<p>
~우리 서로 사랑하며 살아요~
</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>이미지 삽입</title>
</head>
<body>
<h3>이미지 삽입</h3>
<hr>
<p>엘비스 프레슬리의 사진입니다.</p>
<img src="media/Elvis1.jpg" width="150" height="200"
alt="Elvis">AC
<img src="meida/kitae.jpg" wodth="80" height="100"
alt="황기태사진없음">
<img src="http://img.naver.net/static/www/u/2013/0731/nmms_224940510.gif"
alt="사진 주소 변경됨" width="100" height="100">
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>중첩 리스트 만들기</title>
</head>
<body>
<h3>내가 사는 이유</h3>
<hr>
<ul>
<li>내가 좋아하는 음식 많아요
<ul>
<li>감자탕
<li>스파게티
<li>올레국수
</ul>
<li>라면 먹기 좋아해요
<ol type="1">
<li>물을 끓인다.
<li>라면과 스프를 넣는다.
<li> 파를 썰어 넣는다.
<li>한 입에 다 먹는다.
</ol>
<li>여름에는 바다로
<li>겨울에는 산으로
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>기본 테이블 만들기</title>
</head>
<body>
<h3>기본 구조를 가진 표</h3>
<hr>
<table border="1">
<caption>1학기 성적</caption>
<thead>
<tr><th>이름</th><th>HTML</th><th>CSS</th></tr>
</thead>
<tfoot>
<tr><th>합</th><th>225</th><th>230</th></tr>
</tfoot>
<tbody>
<tr><td>황기태</td><td>80</td><td>70</td></tr>
<tr><td>이재문</td><td>95</td><td>99</td></tr>
<tr><td>이병은</td><td>40</td><td>61</td></tr>
</tbody>
</table>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>기본 테이블 만들기</title>
</head>
<body>
<h3>기본 구조를 가진 표</h3>
<hr>
<table border="1">
<tr>
<td rowspan="3">A</td>
<td colspan="2">B</td>
</tr>
<tr>
<td rowspan="2">C</td>
<td>D</td>
</tr>
<tr>
<td>E</td>
</tr>
</tbody>
</table>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>링크 만들기</title>
</head>
<body>
<h3>링크 만들기</h3>
<hr>
포털 사이트
<ul>
<li><a href="http://www.naver.com">네이버</a></li>
<li><a href="http://www.daum.net">다음</a></li>
</ul>
신문 사이트
<ul>
<li><a href="http://www.etnews.com/">
<img src="media/iconetnews.png" alt="전자신문">
</a>
</li>
<li><a href="http://www.chosun.com">
<img src="media/iconchosun.png" alt="조선일보">
</a>
</li>
</ul>
<hr>
<a href="ex2-17.html">예제 2-17로 이동</a>
</body>
</html>
반응형
'Programming > Web Programming (2018)' 카테고리의 다른 글
| [웹프로그래밍] 1. 웹 프로그래밍 개요 (0) | 2021.03.25 |
|---|---|
| 웹 프로그래밍 공부하기 (0) | 2021.03.25 |
