data lab

HTML 기본 기능 태그 알아보기

LAB 관리자 2023. 12. 29. 18:29
반응형

html의 기본기능은 웹 브라우저에 보여 줄 내용에 마크업하고 문서끼리 링크하는 것이다.

글자를 보기좋게 꾸미거나 문서의 배치를 다양하게 바꾸는 것은 스타일시트의 기능이다.

 

<!DOCTYPE html> 

문서유형을 지정하는 태그. 웹브라우저에게 현재 문서가 HTML5임을 알려주는 것이다.

HTML에서는 영어 대소문자를 구별하지 않아도 되지만 강조하고 싶은 부분에 대문자를 사용하기도 한다.

HTML5 는 2014년 11월에 발표됐고, 지금은 거의 다 HTML5를 쓰므로 HTML5를 그냥 HTML이라고 부른다.

 

<html> </html>

웹 문서의 시작과 끝을 나타내는 태그. 웹 브라우저가 이 태그 내의 소스를 읽어 화면에 표시한다.

<html lang="ko">는 위의 <html> </html>태그에서, language 속성으로 korean을 선택한다는 의미이다. 
특정 언엉로 제한해서 검색할 때 (한국말 문서만 띄워줘) 활용된다. 

 

<head> </head>

웹브라우저가 알아야할 내용을 적을 태그. <meta>, <title> 등이 포함된다.

<meta

<meta = charset="UTF-8"> 화면에 글자를 표시할 때 어떤 인코딩 사용할지 지정. 한글을 표시하기 위해 UTF-8이라는 문자세트를 사용한다는 메타태그이다.

<title> </title>

맨 위의 탭에 뜨는 창의 이름이다.

 

<body> </body>

웹문서 내용 들어갈 태그

 

<h1></h1> ~ <h6></h6>

글씨의 크기를 조절하는 태그이다. h1이 가장 크고 h6이 가장 작다.

 

<header> </header>

헤더 영역. 주로 맨 위쪽이나 왼쪽에 있다.

 

<nav> </nav>

같은 웹 문서 안에서 다른 위치나 다른 문서로 연결하는 링크를 만듬. 내비게이션 바.

 

<div> </div>

<div id="logo"> </div> 처럼, ID 를 설정할 수 있다.

 

<main> </main>

메인 컨텐츠가 들어가는 태그

 

<article> </article>

신문이나 잡지의 기사처럼 웹에서 실제로 보여주고 싶은 내용을 넣는다.

 

<section> </section>

아티클 태그 내에서 몇개의 컨텐츠를 묶는 용도.

 

<aside> </aside>

사이드바 내용

 

<footer> </footer>

웹 문서 맨 아래쪽에 있는 푸터 영역

 

<p> </p>

텍스트 단락을 만드는 태그

 

<br>

줄을 바꾸는 태그

반응형