00. 태그(Tag)란?
HTML에서 사용하는 명령어를 '태그'라고 하며, '<'와 '>'기호로 둘러싸여 있습니다.
시작 태그와 종료 태그 한 쌍으로 사용하거나, ex) <tag> content </tag>
종료 태그를 사용하지 않고 단독으로 사용할 수도 있습니다. ex) <tag> content
또한, 태그는 중첩해서 사용이 가능합니다.
01. 기본 형식
<!DOCTYPE html> ①
<html> ②
<head> ③
<title> 웹 문서 제목 </title>
</head>
<body> ④
웹 문서 내용
</body>
</html>
① DOCTYPE 선언 : 모든 html 문서는 문서 유형(document type)의 선언으로 시작되어야 한다. 웹 페이지가 작성된 버전을 알려주며 반드시 <html>태그보다 앞서 선언해주어야 한다.
② <html>영역 : HTML 문서임을 나타내는 태그로, <html>로 시작해 </html>으로 끝나며, 그 사이에 <head>영역과 <body>영역이 있다.
③ <head>영역 : 웹 문서의 제목, 키워드, 문자셋 등 웹 브라우저나 검색 엔진에 제공할 정보를 입력한다.
④ <body>영역 : HTML 문서의 눈에 보이는 영역으로, 웹 문서의 실질적인 내용을 입력한다. 서술된 내용이 웹 브라우저 화면에 바로 나타난다.
02. HTML 문서 작성해보기
웹문서 작성을 위해선 HTML 에디터와 웹 브라우저가 필요한데, HTML 에디터란 문법을 잘 몰라도 쉽게 사용할 수 있도록 도와주는 저작 도구를 뜻합니다.
종류로는 Sublime Text3, EditPlus, AcroEdit, Brackets 등이 있고, 이외에도 여러 프로그램이 있으니 자신에게 맞는걸로 찾아 다운받습니다.
1) 에디터를 이용해 아래와 같이 작성합니다.
1 2 3 4 5 6 7 8 | <html> <head> <title>연습 문서</title> </head> <body> 첫 번째로 작성한 문서입니다. </body> </html> | cs |
2) 파일을 다른 이름으로 저장하는데, 파일명 뒤에 반드시 '.html'이라는 확장자명을 붙입니다.
3) 저장한 파일을 웹 브라우저로 열어 작성한 내용과 비교해봅니다.
* <title>...</title>태그 : <head>영역 내에 사용하며, 제목 표시줄에 표시되는 내용을 변경할 수 있습니다.
6. 목록을 만드는 태그 <ul>, <ol>, <dl> (0) | 2017.01.11 |
---|---|
5. 문단 정렬 태그 (0) | 2017.01.09 |
4. 제목을 나타내는 태그 <h1>~<h6> (0) | 2017.01.08 |
3. 시맨틱 요소와 시맨틱 웹 (0) | 2017.01.07 |
2. <meta>태그 (0) | 2017.01.04 |
댓글,