3 주차 _2

교시

웹 프로그래밍 기초
행복교육원 채미혜
 2. HTML 기본 태그

- 이미지와 멀티미디어 태그
1. 이미지 태그
1.1 이미지 삽입하기 - <img>
1. 이미지 태그
1.1 이미지 삽입하기 - <img>

 웹에서 사용할 수 있는 이미지 파일

1. 이미지 태그
1.2 <img> 태그의 속성
1. 이미지 태그
1.2 <img> 태그의 속성

 <img> 태그의 속성
2. HTML 기본 태그

- 서식 태그
1. 서식 태그
1.1 서식 태그

 <b> : 굵게  <ins> 삽입효과

 <b> 굵게 </b>  <ins> 삽입한듯 </ins>

 <strong>: 강조효과  첨자
 <strong> 강조효과 </strong>  <sup> : 위첨자
• ^위첨자
 <sub> : 아래첨자
 <mark>: 하이라이팅
• _아래첨자
 <mark> 하이라이팅 </mark>

 <i>: 기울림꼴
 <del>: 삭제효과  <i> 기울림꼴 </i>
 <del> 삭제 것 같이 </del>

Page 8
2. HTML 기본 태그

- 테이블 태그
1. 테이블 태그
1.1 테이블 만들기 - <table>

 <table>, <th>, <tr>, <td> 태그

 <table> : 테이블 전체를 만들 때 사용
 <tr> : 행을 나타낼 때 사용
 <th> : 열의 제목을 나타낼 때 사용
 <td> : 열을 나타낼 때 사용

<style>
table, th, tr, td {
border:solid 1px black;
border-collapse: collapse;
padding:8px
}
</style>
1. 테이블 태그
1.1 테이블 만들기 - <table>
1. 테이블 태그
1.2 셀 병합하기
수업 요약
 정의목록 : <dl>, <dt>, <dd>
 링크 태그 : <a>
 속성 : href, target

 이미지 태그 : <img>
 속성 : src, width, height, title
 서식태그 : <b>, <strong>, <i>, <em>, <mark>, <del>, <ins>, <sup>, <s
ub>
 테이블태그
 <table>
 <tr>, <th>, <td>
 속성 : colspan, rowspan
수업 요약
 정의목록 : <dl>, <dt>, <dd>
 링크 태그 : <a>
 속성 : href, target
 이미지 태그 : <img>
 속성 : src, width, height, title
 서식태그 : <b>, <strong>, <i>, <em>, <mark>, <del>, <ins>, <sup>, <s
ub>
 테이블태그
 <table>
 <tr>, <th>, <td>
 속성 : colspan, rowspan
 <caption> : 테이블 상단에 제목이나 짧은 설명을 붙여줌
과제
1. 수업시간 동안 작성한 파일을 폴더 안에 넣어서 제출
 폴더 이름 : 학번 _ 이름
 제출 파일
 정의목록 .html
 링크태그 .html
 이미지태그 .html
 서식태그 .html
 테이블태그 .html

2. 출제된 퀴즈 작성해 보기
참고문헌

 생활코딩 ! HTML+CSS+ 저바스크립트 , 이고잉 저 , 위키북스

 예제 중심의 웹 프로그래밍 입문서 HTML & CSS for Beginner,

황재호 저 , 한빛 아카데미

 예제 중심 HTML & 자바 스크립트 & CSS for 초급 & 중급 ,

장수진저 , 현우사

 코딩 스쿨 : http://tcpschool.com/html/intro

 생활 코딩 ! https://opentutorials.org
Page 16