HTML이란?
Hyper Text Markup Langauge
하이퍼텍스트 : 단위 텍스트와 링크로 구성, 사용자가 연상하는 순서에 따라 관련 값을 얻음
마크업 : 태그, 문서의 구조와 내용 등에 추가적인 정보를 부여하기 위한 일련의 문자 또는 기호
절차적마크업 언어 : ex) 워드프로세서, 특정마크업 언어, 호환성 부족
기술적마크업 언어 : ex) SGML, HTML, XML, 범용 마크업 언어
XML : extensible markup language, 사용자가 태그를 정의해서 사용 가능
html과 달리 문서의 논리적 구조를 정의하는데 초점
HTML : 웹페이지를 작성하기 위한 가장 기본적인 언어
단점 : 의미보다는 외양적인 부분 초점, 정확성 검증 어려움, 제한적인 태그
W3C : 웹에 대한 표준과 기술의 연구와 개발을 총괄하는 비영리단체
HTML 문서는 다양한 요소들의 조합이다.
<head></head> 사이에 들어가는 내용
HTML 5는 <meta charset="UTF-8">, <title>, <link rel="stylesheet" href="파일명">
<base href = "">, CSS, javascript 등이 들어감
<br> 태그 : 종료태그 없이 사용
<p> 태그 : 문단을 나누어 독립된 단락을 생성, 단락 전후에서 줄바꿈이 수행됨
여러개를 동시에 사용해도 한 줄만 띄어진다.
  : 공백문자
<hr> 태그 : 단락의 주제를 구분하는 용도, 자동 줄바꿈, 수평선을 그림
<hn> 태그 : h1~h6 단락의 제목을 지정, bold, 자동줄바꿈 기능포함
<pre> </pre> : 편집기에서 문자가 입력된 형식을 그대로 유지하여 출력
<blockquote> 상하여백으로 구분되는 단락의 생성 및 들여쓰기 기능,
주로 인용문을 만들 때 사용, cite 속성
- 글자스타일 지정
1) 물리적 스타일 관련 태그 : 단순히 웹 브라우저에 표시되는 출력 모양만을 지정
2) 논리적 스타일 관련 태그 : 출력 형태보다는 태그 자체에 의미가 부여
<cite></cite> : 제목 표시
<q></q> : 짧은 인용구를 표시
- 목록지정
1) 순서없는 목록(Unordered List)
<ul>
<li>항목1</li>
<li>항목2</li>
</ul>
2) 순서있는 목록(Ordered list)
<ol>
<li>항목1</li>
<li>항목2</li>
</ol>
3) 서술 목록(description list)
<dl>
<dt>항목1</dt> -- 태그 용어/이름을 나열
<dd>항목2</dd> -- 나열된 용어/이름에 대한 설명을 표시
</dl>
- 인라인 요소와 블록 요소
1) 인라인 요소 : 줄바꿈이 수행되지 않음(span)
2) 블록 요소 : 하나의 줄을 전부차지해서 표시 (div, p, h1)
- <div> vs <span>
<div> HTML 요소를 묶어 하나의 논리적인 단위의 영역을 구성, 레이아웃 구성
<span> 텍스트를 위해 사용, 줄바꿈이 없음
'문돌이의 IT > HTML&CSS' 카테고리의 다른 글
| HTML에서 테이블 표현 (0) | 2017.04.16 |
|---|---|
| HTML 이미지삽입, 하이퍼링크삽입, <iframe> 태그 (0) | 2017.04.15 |
| HTML5 Form태그로 회원가입 양식 만들기(fieldset legend) (0) | 2016.04.08 |
| [문돌이의IT] HTML form태그와 get방식에 대해 알아보자 (0) | 2016.02.04 |
| [문돌이의IT] colspan, rowspan CSS속성으로 표의 셀병합 기능 표현하기 (0) | 2016.01.17 |