HTML 기본 사용법

2023-03-26

HTML이란?

HTML 은 Hyper Text Markup Language의 약자로 웹 페이지와 그 내용을 구조화하기 위해 사용하는 코드다.
HTML은 프로그래밍 언어가 아닌 마크업 정보를 정의하는 마크업 언어로 문서의 구조나 서식을 포함한다.
요소들로 이루어져 있으며 요소는 시작 태그, 내용, 끝 태그로 이루어져 있다.
HTML editor로는 주로 VS Code, vim, Xcode 등을 사용한다.
DOCTYPE 선언은 HTML 문서에서 가장 먼저 선언돼야 한다.
DOCTYPE 선언은 HTML 태그는 아니지만, 선언된 페이지의 HTML 버전이 무엇인지를 웹 브라우저에 알려주는 역할을 하는 선언문이다.

HTML을 기술하기 위하여 사용하는 명령어의 집합을 태그(Tag)라고 한다.
태그는 기본적으로 여는 태그와 닫는 태그로 구성된다.
닫는 태그 없이 사용하는 태그도 존재한다.

ex) <br>

<tag명 속성명1="속성값1" 속성명2="속성값2"> 컨텐츠 </tag명>

HTML 기본 구조
<!DOCTYPE html>
<html>
    <head>

    </head>
    <body>
        
    </body>
</html>

<a>: 문서에서 문서로 이동하는 수단.
속성으로는 링크이름과 연결되어 있는 리소스의 주소를 표시하는 href 등이 있다. 희스토리
ex) <a href="URL" ~ >링크 이름</a>
<p>: 문단을 구분할 때 사용한다.
문단과 문단 사이에 공백라인이 들어간다.
<br>: HTML에서는 enter와 같은 개행문자를 무시하기에 줄바꿈을 위해 사용한다.
&nbsp: HTML에서는 스페이스로 공백을 한칸까지만 만들 수 있기에 더 많은 공백을 주기 위해 &nbsp를 사용
<img>: 이미지를 표현하기 위한 태그.
속성으로는 이미지의 위치(url)을 기술하는 src ,
http:// 또는 https:// - 절대경로 URL로 지정한다.
path/to/image/file: 상대경로로 지정한다.
이미지 크기를 지정하는 width, height 등이 있다.
<ul>: 순서가 없는 리스트, 하위 항목을 표시할때는 <li>로 표현
<ol>: 순서가 있는 리스트, 하위 항목을 표시할때는 <li>로 표현
<iframe>: 페이지 안에 페이지를 삽입하는 방법.
속성으로는 불러올 페이지의 URL을 기술하는 src
<table>: 데이터를 표로 표현하는 방법, 데이터 구조화에 사용.
<th>는 테이블 행, 열의 머리말, 데이터 그룹의 제목에 해당.
<tr>은 테이블의 행을 표현.
<td>는 표의 내용, 셀을 표현.
속성으로는 열을 병합하는 colspan과 행을 병합하는 rowspan이 있다.

이름	나이
김희범	25

이스케이핑: HTML코드 예를 들어<br>태그를 줄바꿈의 용도가 아니라 화면에 표시하기 위한 방법.
ex) '<'는 &lt, '>'는 &gt, '&'는 &amp, "는 &quot로 표현한다.