본문 바로가기
프로그래밍/HTML5 태그 를 뛰어넘어라

(HTML/HTML5) 1.기본태그 <html> 2/10

by it-수다쟁이증후군 2019. 3. 23.


직전복습 는 문서의 유형을 웹브라우저에서 알려주는 역할을 한다. 작성자 : “웹브라우져야 이 문서는 html문서규칙에 따라 작성되었으니 준비해라!!!” 웹브라우져 : “네” 사용법은 ctr+c ctr+v 작성포스트 바로가기
이전의 강의를 간략하게 줄이면 위와 같다. 이번에는 태그에 대해서 알아보자.

html5 태그완전정복 기초태그편 html

<html>태그는 기본태그 10개 중에서 2번째에 있다. 아래 그림을 보면 간단히 알 수 있다.

html5 html간단설명


1.html태그 <html> 간단 정리

의미/역할 : 웹브라우저에게 “여기서부터 이제 시작한다.” 라고 시작점을 알려준다. 사용법 : 바로 밑에 적어주면 된다. 정말 쉽다.

사용법 : 바로 밑에 적어주면 된다. 정말 쉽다.

html 실제사용



참고로. lang속성은 이 문서의 내용이 한글로 작성되었다는 것을 알려준다. 안 적어도 무방하다. 그러나 검색사이트에서 문서를 찾을 때 몇 가지 특정 조건을 넣어서 검색할 수 있는데 그중에 하나가 특정언어로 검색 조건을 넣을 수 있다. 아래처럼 말이다.

html lang 속성을 쓰는 이유



다른 언어를 작성한다면 ISO Language Codes에따라 작성하면 된다. 예를 들자면 영어는 lang="en" 이다. 가끔 lang="en-US"처럼 뒤에 대문자 2개가 더 붙는 경우를 볼 수 있다. 이를 지역코드라고 하는데 추가적으로 미국이라는 정보를 알려준다. ISO Country Codes에 따라 작성하면 된다.



2.html태그 <html> 한걸음 더.


2-1)html은 중첩구조이다.
html문서는 네스트구조로 이루어져있다. 그중 태그가 최상위 태그다. 혹시 마트료시카라는 인형을 본적이 있는가?

중첩구조 마트료시카


출처;위키백과 태그는 저기 보이는 1번이다. 1번안에 2번이 들어가는 구조이다. 물론 1번안에 2번을 넣지 않고 3번이 들어 갈수 있고 5번이 들어 갈수 있다. 위에 인형을 물리적 한계 때문에 무한정 중첩할 수 없지만, html의 구조는 무한히 중첩할 수 있다.
그럼 실제 html 구조는 어떻게 이루어져 있는가?

html 문서의 중첩구조

위와 같이 태그 안에 태그와 태그가 포함되어있다. 자세한 설명은 뒤에서 하기로 하고 오늘은 간단히 이렇게만 기억하자. html바로 안에 head와 body


2-2)html에 에 적용되는 속성들.
태그에는 글로벌속성들만 적용된다. 글로벌 속성에는 총 15개가 있으나 거의 대부분에서 lang 속성만 사용한다. 참고로 글로벌 속성은 모든 태그에 적용가능하다.



최종정리


1<!doctype html>에 바로 다음에.<html lang="ko">
2.html은 head와 body를 포함한다.
3.html 문서를 만들면

1
2
3
4
5
6
7
8
9
10
<!doctype html>
<html lang="ko">
 
    <head>
    </head>
 
    <body>
    </body>
 
</html>
cs

이렇게 기본으로 넣고 시작하면 된다.

다음챕터에서는 html기본태그 <head>에 대해서 알아보자 ㄱㄱㄱ




댓글