불로구
1강. HTML5 기본 문서 만들기 본문
HTML 이란?
HTML은 웹 문서를 작성하는 태그 언어이다.
HTML은 <html>,<head>,<title>,<body>라는 필수 태그를 포함한다.
1) HTML 기본 문서 작성
HTML은 <h1>~<h6>의 6개의 태그를 제공하염 문단에 제목을 붙인다.
<title></title>사이에 들어가는 문장은 웹 페이지 타이틀이다.
2) 단락 나누기 <p>
HTML에서 문단은 여러 단락으로 나눌 수 있으며 하나의 단락은 <p>태그로 표현한다. </p>로 끝나는 문단 다음에는 자동으로 빈 줄이 생긴다.
차이점을 찾으셨나요?
p태그를 이용하면 오른쪽 사진처럼 문단 다음 자동으로 빈 줄이 생긴다.
3) 수평선 긋기 <hr>
문단 내에서 내용의 전환이 필요한 곳에 수평선을 삽입하여 시각적 효과를 만들 수 있다. (* hr태그는 종료 태그가 없다 => </hr> 사용하지 않음!!>
hr태그를 사용하면 오른쪽 사진의 아래처럼 수평선이 생긴다.
4) 새로운 줄로 넘어가기 <br>
HTML에서는 ENTER키를 입력해도 한 개의 빈칸으로 처리되어 다음 줄로 넘어가지 않는다. 다음 줄로 넘어가기 위해선 br태그를 사용한다.
br태그를 사용하지 않으면 오른쪽 그림의 상단처럼 한줄로 표시가 되며 br태그를 사용하여야 다음줄로 넘어간다.
(* br태그를 n개 연속 사용시 n개의 줄로 넘어간다!!)
5) 그대로 출력하기 <pre>
개발자가 의도한 모양대로 입력한 포맷 그대로 출력
p태그를 사용하였을때는 한줄로 표시가 된다. pre태그를 사용하였을때는 입력한 포맷 그대로 출력되는 것을 볼 수 있다.
1강에서 소개한 내용 모두 이해하셨나요?!
연습문제 나갑니다~
1강 연습문제코드로 작성하면서 연습해보세요.혹시나 궁금한 점은 댓글로 남겨주세요!
'프로그래밍 > HTML & CSS' 카테고리의 다른 글
| 6강. HTML5 - 비디오태그( 동영상을 넣어보자!) (0) | 2020.06.15 |
|---|---|
| 5강. HTML5 - 오디오태그( 음악을 넣어보자!) (0) | 2020.05.14 |
| 4강. HTML5 - 로그인 폼 만들기 (0) | 2020.05.13 |
| 3강. 표만들기 & 하이퍼링크 (0) | 2020.05.09 |
| 2강. 고급 문서 만들기 (0) | 2020.05.07 |
